*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#f5f5f5;color:#333;min-height:100vh}.page{max-width:600px;margin:0 auto;padding:24px 16px}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;padding-bottom:16px;border-bottom:1px solid #eee}.page-header h1{font-size:20px;font-weight:700;color:#111}.page-header nav{display:flex;gap:16px}.page-header nav a{color:#666;text-decoration:none;font-size:14px;padding:4px 8px;border-radius:4px;transition:all .2s}.page-header nav a:hover{color:#111;background:#eee}.page-header nav a.active{color:#fff;background:#0070f3}.hero{text-align:center;padding:40px 0}.hero h2{font-size:28px;font-weight:700;margin-bottom:12px}.hero p{color:#666;font-size:16px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:32px 0}.feature{background:#fff;padding:20px;border-radius:12px;text-align:center;box-shadow:0 1px 3px #0000001a}.feature h3{font-size:14px;font-weight:600;margin-bottom:8px;color:#111}.feature p{font-size:12px;color:#666}.cta{text-align:center;margin:32px 0}.btn-primary{display:inline-block;padding:12px 32px;background:#0070f3;color:#fff;text-decoration:none;border-radius:8px;font-weight:600;transition:background .2s}.btn-primary:hover{background:#0060df}.api-info{background:#f0f0f0;padding:12px;border-radius:6px;margin-bottom:24px;overflow-x:auto}.api-info code{font-family:SF Mono,Monaco,Courier New,monospace;font-size:12px;color:#666}.records-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}.records-hero h2{font-size:24px;font-weight:700;margin-bottom:8px}.records-hero p{color:#666;line-height:1.5}.btn-secondary,.btn-danger{border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.btn-secondary{padding:10px 16px;background:#111;color:#fff}.btn-secondary:hover:not(:disabled){background:#333}.btn-danger{padding:10px 14px;background:#fbe9e9;color:#b42318}.btn-danger:hover:not(:disabled){background:#f7d9d9}.btn-secondary:disabled,.btn-danger:disabled{opacity:.6;cursor:not-allowed}.record-form{display:flex;gap:12px;margin-bottom:24px}.record-form input{flex:1;padding:12px 16px;border:1px solid #ddd;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s}.record-form input:focus,.record-row input:focus{border-color:#0070f3}.record-form button,.record-actions .btn-action{padding:12px 24px;background:#0070f3;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.record-form button:hover:not(:disabled),.record-actions .btn-action:hover:not(:disabled){background:#0060df}.record-form button:disabled,.record-actions .btn-action:disabled{background:#ccc;cursor:not-allowed}.status{margin-bottom:16px;padding:12px 14px;border-radius:8px;font-size:14px}.status.error{background:#fff1f1;color:#c00}.records-panel{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 3px #0000001a}.records-meta{display:flex;justify-content:space-between;gap:12px;margin-bottom:16px;color:#666;font-size:13px}.record-list{display:grid;gap:12px}.record-row{display:grid;grid-template-columns:72px minmax(0,1fr) 160px auto;gap:12px;align-items:center;padding:14px 16px;border:1px solid #eee;border-radius:10px}.record-id{font-family:SF Mono,Monaco,Courier New,monospace;font-size:12px;color:#666}.record-content{min-width:0}.record-content p{display:block;color:#111;word-break:break-word}.record-content input{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:8px;font-size:14px}.record-time{font-size:12px;color:#999}.record-actions{display:flex;gap:8px}.empty-state{color:#999;text-align:center;padding:24px 0}.about h2{font-size:24px;font-weight:700;margin-bottom:16px}.about h3{font-size:16px;font-weight:600;margin:24px 0 12px;color:#111}.about p{color:#666;line-height:1.6;margin-bottom:16px}.about ul{list-style:none;margin-bottom:16px}.about li{color:#666;padding:8px 0;border-bottom:1px solid #eee}.about li:last-child{border-bottom:none}.about li code{background:#f0f0f0;padding:2px 6px;border-radius:4px;font-family:SF Mono,Monaco,Courier New,monospace;font-size:12px}.about .links{margin-top:32px}.about .links a{color:#0070f3;text-decoration:none;font-weight:600}.about .links a:hover{text-decoration:underline}.auth-hero{margin-bottom:24px}.auth-hero h2{font-size:24px;font-weight:700;margin-bottom:8px}.auth-hero p{color:#666}.auth-tabs{display:flex;gap:8px;margin-bottom:24px;border-bottom:1px solid #eee;padding-bottom:0}.auth-tab{padding:10px 16px;border:none;background:transparent;font-size:14px;font-weight:500;color:#666;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s,border-color .2s}.auth-tab:hover{color:#111}.auth-tab.active{color:#0070f3;border-bottom-color:#0070f3}.auth-form{background:#fff;border-radius:12px;padding:24px;box-shadow:0 1px 3px #0000001a}.auth-form .form-group{margin-bottom:20px}.auth-form .form-group:last-of-type{margin-bottom:24px}.auth-form label{display:block;font-size:14px;font-weight:600;color:#333;margin-bottom:8px}.auth-form input,.auth-form textarea{width:100%;padding:12px 16px;border:1px solid #ddd;border-radius:8px;font-size:14px;font-family:inherit;outline:none;transition:border-color .2s;box-sizing:border-box}.auth-form input:focus,.auth-form textarea:focus{border-color:#0070f3}.auth-form input:disabled,.auth-form textarea:disabled{background:#f5f5f5;cursor:not-allowed}.auth-form textarea{resize:vertical;font-family:SF Mono,Monaco,Courier New,monospace;font-size:12px}.auth-submit{width:100%;padding:14px;font-size:15px;border:none;cursor:pointer;border-radius:8px}.auth-submit:disabled{background:#ccc;cursor:not-allowed}.auth-divider{text-align:center;color:#999;font-size:13px;margin:16px 0;position:relative}.auth-divider:before,.auth-divider:after{content:"";position:absolute;top:50%;width:44%;height:1px;background:#eee}.auth-divider:before{left:0}.auth-divider:after{right:0}.btn-google{width:100%;padding:12px;background:#fff;color:#333;border:1px solid #ddd;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.btn-google:hover:not(:disabled){background:#f5f5f5}.btn-google:disabled{opacity:.6;cursor:not-allowed}.auth-result{margin-top:20px;padding:16px;background:#f6fff6;border:1px solid #b7edb7;border-radius:8px}.auth-result-hint{font-size:13px;color:#2d7a2d;margin-bottom:10px}.auth-result pre{background:#f0f0f0;padding:12px;border-radius:6px;font-family:SF Mono,Monaco,Courier New,monospace;font-size:11px;overflow-x:auto;white-space:pre-wrap;word-break:break-all}.token-preview{word-break:break-all;color:#555}@media (max-width: 480px){.features{grid-template-columns:1fr}.page-header{flex-direction:column;gap:12px}.records-hero,.records-meta{flex-direction:column}.record-row{grid-template-columns:1fr}.record-actions{flex-wrap:wrap}}.email h2{font-size:24px;font-weight:700;margin-bottom:8px}.email .desc{color:#666;margin-bottom:24px}.email-form{background:#fff;border-radius:12px;padding:24px;box-shadow:0 1px 3px #0000001a}.email-form .form-group{margin-bottom:20px}.email-form .form-group:last-of-type{margin-bottom:24px}.email-form label{display:block;font-size:14px;font-weight:600;color:#333;margin-bottom:8px}.email-form input,.email-form textarea{width:100%;padding:12px 16px;border:1px solid #ddd;border-radius:8px;font-size:14px;font-family:inherit;outline:none;transition:border-color .2s}.email-form input:focus,.email-form textarea:focus{border-color:#0070f3}.email-form input:disabled,.email-form textarea:disabled{background:#f5f5f5;cursor:not-allowed}.email-form textarea{resize:vertical;min-height:120px}.email-form .btn-primary{width:100%;padding:14px;font-size:16px}.email-form .btn-primary:hover:not(:disabled){background:#0060df}.email-form .btn-primary:disabled{background:#ccc;cursor:not-allowed}.email .result{margin-top:24px;background:#fff;border-radius:8px;padding:16px;box-shadow:0 1px 3px #0000001a}.email .result h3{font-size:14px;font-weight:600;margin-bottom:12px;color:#333}.email .result pre{background:#f5f5f5;padding:12px;border-radius:6px;font-family:SF Mono,Monaco,Courier New,monospace;font-size:12px;overflow-x:auto;margin-bottom:12px}.email .result.error{background:#fff5f5;color:#c00;text-align:center}