*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app{flex-direction:column;min-height:100vh;padding:20px;display:flex}.auth-container{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.auth-card{background:#fff;border-radius:16px;width:100%;max-width:500px;padding:40px;box-shadow:0 20px 60px #0000004d}.auth-card h1{text-align:center;color:#667eea;margin-bottom:10px;font-size:2.5rem}.auth-subtitle{text-align:center;color:#666;margin-bottom:40px;font-size:1.1rem}.auth-section{margin-bottom:30px}.auth-section h2{color:#333;margin-bottom:10px;font-size:1.3rem}.auth-description{color:#666;margin-bottom:20px;font-size:.95rem;line-height:1.5}.divider{color:#999;align-items:center;margin:30px 0;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid #ddd;flex:1}.divider span{padding:0 15px;font-weight:600}.code-input{text-align:center;letter-spacing:.2em;text-transform:uppercase;border:2px solid #ddd;border-radius:8px;width:100%;margin-bottom:10px;padding:15px;font-family:Courier New,monospace;font-size:1.5rem;transition:border-color .3s}.code-input:focus{border-color:#667eea;outline:none}.error-message{color:#e74c3c;text-align:center;margin-bottom:10px;font-size:.9rem}.btn{cursor:pointer;border:none;border-radius:8px;width:100%;padding:15px 25px;font-size:1.1rem;font-weight:600;transition:all .3s}.btn-primary{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 20px #667eea66}.btn-secondary{color:#fff;background:#34495e}.btn-secondary:hover{background:#2c3e50;transform:translateY(-2px);box-shadow:0 5px 20px #34495e66}.btn-scan{color:#fff;background:#667eea;margin-top:10px}.btn-scan:hover{background:#586bd6}.scanner-overlay{z-index:1000;background:#0f172ad1;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.scanner-card{text-align:center;background:#fff;border-radius:16px;width:min(100%,440px);padding:24px;box-shadow:0 20px 60px #0006}.scanner-card h2{color:#333;margin-bottom:16px}.scanner-viewport{aspect-ratio:1;background:#111827;border-radius:12px;position:relative;overflow:hidden}.scanner-viewport video{object-fit:cover;width:100%;height:100%}.scanner-guide{border:3px solid #fff;border-radius:12px;position:absolute;inset:15%;box-shadow:0 0 0 999px #00000040}.scanner-message{color:#555;min-height:44px;margin:14px 0;line-height:1.4}.btn-small{width:auto;margin-left:10px;padding:8px 16px;font-size:.9rem}.btn-logout{background:#e74c3c}.btn-logout:hover{background:#c0392b}.header{color:#fff;margin-bottom:20px}.header-content{justify-content:space-between;align-items:center;max-width:900px;margin:0 auto;display:flex}.header h1{text-shadow:2px 2px 4px #0003;margin-bottom:5px;font-size:2rem}.subtitle{opacity:.9;font-size:1rem}.subtitle strong{letter-spacing:.1em;background:#fff3;border-radius:4px;padding:2px 8px;font-family:Courier New,monospace}.header-actions{align-items:center;display:flex}.qr-container{justify-content:center;margin-bottom:20px;display:flex}.qr-card{text-align:center;background:#fff;border-radius:12px;padding:30px;box-shadow:0 10px 40px #0003}.qr-card h3{color:#333;margin-bottom:20px;font-size:1.3rem}.qr-code-text{color:#667eea;letter-spacing:.2em;margin:15px 0;font-family:Courier New,monospace;font-size:1.8rem;font-weight:700}.qr-instruction{color:#666;margin-top:10px;font-size:.9rem}.main{flex:1;justify-content:center;align-items:stretch;width:100%;max-width:900px;margin:0 auto;display:flex}.note-textarea{resize:vertical;background:#fff;border:none;border-radius:12px;width:100%;min-height:400px;padding:25px;font-family:Courier New,Courier,monospace;font-size:1.1rem;line-height:1.6;transition:box-shadow .3s;box-shadow:0 10px 40px #0003}.note-textarea:focus{outline:none;box-shadow:0 15px 50px #0000004d}.note-textarea::placeholder{color:#999;font-style:italic}.footer{text-align:center;color:#fff;opacity:.8;margin-top:30px;font-size:.95rem}@media (width<=768px){.auth-card{padding:30px 20px}.header-content{text-align:center;flex-direction:column}.header-actions{flex-wrap:wrap;justify-content:center;margin-top:15px}.btn-small{margin:5px}.header h1{font-size:1.5rem}.subtitle{font-size:.9rem}.note-textarea{padding:20px;font-size:1rem}.qr-card{padding:20px}.code-input{font-size:1.2rem}}:root{color:#202a3c;font-synthesis:none;background:#f6f8fb;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}body{color:#202a3c;background:#f6f8fb;min-width:320px;margin:0}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:#253148;background:#fff;border:1px solid #d6dce6;border-radius:8px;padding:10px 16px;font-size:.875rem;font-weight:600}button:hover{background:#eef2f8}button:disabled{opacity:.5;cursor:not-allowed}button.primary{color:#fff;background:#2458df;border-color:#2458df}button.primary:hover{background:#1947c6}a{color:inherit;text-decoration:none}:focus-visible{outline-offset:3px;outline:3px solid #5c86f0}input,textarea,select{color:#202a3c;background:#fff;border:1px solid #d6dce6;border-radius:8px;padding:10px 12px}textarea{resize:vertical}h1,h2,p{margin:0}h1{letter-spacing:-.045em;font-size:2rem;line-height:1.2}h2{letter-spacing:-.025em;font-size:1.35rem}.shell-header{background:#fff;border-bottom:1px solid #e1e6ef;justify-content:space-between;align-items:center;height:88px;padding:0 max(5vw,24px);display:flex}.brand{letter-spacing:-.05em;align-items:center;gap:8px;font-size:1.25rem;font-weight:750;display:flex}.brand-mark{color:#fff;background:#2458df;border-radius:10px;justify-content:center;align-items:center;width:34px;height:34px;margin-right:6px;font-size:1.7rem;display:flex}.brand-mark span{color:#a6c5ff}.brand-light{color:#828c9e;letter-spacing:0;font-size:1rem;font-weight:400}.home-link{gap:24px;font-size:.875rem;font-weight:600;display:flex}.home{max-width:1280px;margin:auto;padding:76px 40px 32px}.eyebrow{letter-spacing:.15em;color:#61708a;margin-bottom:16px;font-size:.75rem;font-weight:750}.home h1{letter-spacing:-.055em;font-size:clamp(2.5rem,4.7vw,4rem);font-weight:650;line-height:1.12}.home h1>span{color:#7b879a}.home-intro{color:#637087;margin-top:22px;font-size:1rem}.tool-grid{grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px;display:grid}.tool-card{background:#fff;border:1px solid #e0e5ed;border-radius:16px;flex-direction:column;min-height:290px;padding:24px;transition:transform .18s,border-color .18s,box-shadow .18s;display:flex}.tool-card:hover{border-color:#97afe7;transform:translateY(-5px);box-shadow:0 12px 32px #1c365811}.card-top{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.tool-icon{color:#2458df;background:#eaf0ff;border-radius:14px;width:54px;height:54px;padding:14px}.tool-icon svg{width:100%;height:100%}.card-number{color:#8b95a5;font:.75rem monospace}.green .tool-icon{color:#13825d;background:#e2f5ed}.orange .tool-icon{color:#b76717;background:#fff0df}.purple .tool-icon{color:#7752cc;background:#efeafd}.tool-card h2{font-size:1.1rem}.tool-card p{color:#6c778c;flex:1;margin-top:10px;font-size:.875rem;line-height:1.6}.card-bottom{border-top:1px solid #edf0f5;justify-content:space-between;align-items:center;margin-top:28px;padding-top:16px;font-size:.8125rem;font-weight:600;display:flex}.card-bottom>span:last-child{font-size:1.25rem}.home-footer{color:#7a8597;border-top:1px solid #e1e6ef;justify-content:space-between;margin-top:64px;padding-top:22px;font-size:.8125rem;display:flex}.tool-nav{background:#fff;border-bottom:1px solid #e1e6ef;flex-wrap:wrap;justify-content:center;gap:8px;padding:14px 20px;display:flex}.tool-nav a{color:#657189;border-radius:8px;padding:8px 16px;font-size:.875rem}.tool-nav a[aria-current]{color:#2458df;background:#edf2ff;font-weight:650}.workspace{max-width:1280px;margin:auto;padding:44px 40px}.page-heading{justify-content:space-between;align-items:center;gap:24px;margin-bottom:30px;display:flex}.page-heading p{color:#6c778c;margin-top:10px;font-size:.9375rem}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.actions label{font-size:.875rem}.actions select{margin-left:8px}.editor-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.editor-panel,.diff-result,.chat-panel{background:#fff;border:1px solid #dce2ec;border-radius:12px;overflow:hidden}.panel-bar{background:#fff;border-bottom:1px solid #e7ebf2;justify-content:space-between;align-items:center;gap:10px;min-height:60px;padding:12px 18px;font-size:.875rem;display:flex}.panel-bar>label{overflow-wrap:anywhere}.panel-bar button{padding:5px 10px;font-size:.8125rem}.upload{cursor:pointer;border:1px solid #d6dce6;border-radius:6px;flex-shrink:0;padding:5px 10px;position:relative}.upload input{opacity:0;cursor:pointer;width:100%;position:absolute;inset:0}.upload:focus-within{outline:3px solid #5c86f0}.editor-panel textarea{tab-size:2;border:0;border-radius:0;width:100%;height:420px;padding:20px;font:.9375rem/1.7 Consolas,Courier New,monospace;display:block}.panel-footer{color:#758199;border-top:1px solid #edf0f5;padding:8px 18px;font-size:.75rem}.diff-result{margin-top:24px}.diff-result pre{max-height:560px;padding:12px 0;font-size:.875rem;overflow:auto}.diff-line{white-space:pre-wrap;overflow-wrap:anywhere;gap:14px;min-height:22px;padding:0 16px;display:flex}.diff-line>span{flex-shrink:0;width:14px}.diff-line.added{color:#165e36;background:#e2f5e9}.diff-line.removed{color:#9b3030;background:#ffe9e8}.status-message{color:#21654d;margin-top:16px;font-size:.875rem}.error-message{color:#b52f38;margin-top:16px;font-size:.9375rem}.join-grid{grid-template-columns:1fr 1fr;gap:24px;max-width:940px;margin:40px auto;display:grid}.join-panel{background:#fff;border:1px solid #dce2ec;border-radius:14px;padding:34px}.join-panel p{color:#6c778c;margin:16px 0 28px}.join-panel label{margin:18px 0 8px;font-size:.875rem;display:block}.room-input{letter-spacing:.2em;width:100%;margin-bottom:16px;font-family:monospace;font-size:1.3rem;display:block}.room-bar{color:#6c778c;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;font-size:.75rem;display:flex}.room-bar strong{letter-spacing:.12em;color:#202a3c;margin-left:12px;font-family:monospace;font-size:1.1rem}.connection{color:#21815b;font-size:.875rem}.chat-qr{text-align:center;background:#fff;border:1px solid #dce2ec;border-radius:12px;margin-bottom:20px;padding:20px}.chat-qr small{color:#6c778c}.messages{flex-direction:column;gap:14px;height:400px;padding:24px;display:flex;overflow-y:auto}.empty-chat{text-align:center;color:#6c778c;margin:auto}.empty-chat h2{color:#303d55;margin-bottom:8px}.message{background:#f1f4f8;border-radius:12px;align-self:flex-start;min-width:160px;max-width:80%;padding:12px 16px}.message.mine{background:#eaf0ff;align-self:flex-end}.message-meta{color:#65718a;justify-content:space-between;gap:20px;font-size:.75rem;display:flex}.message p{white-space:pre-wrap;overflow-wrap:anywhere;margin-top:5px;font-size:.9375rem}.composer{border-top:1px solid #e1e6ef;align-items:flex-end;gap:12px;padding:18px;display:flex}.composer label{color:#65718a;font-size:.8125rem}.composer input,.composer textarea{width:100%;margin-top:6px;display:block}.name-field{width:160px}.message-field{flex:1}.composer button{margin-bottom:1px}.privacy-note{color:#6c778c;text-align:center;margin-top:14px;font-size:.8125rem}.notes-scope .app{max-width:1280px;min-height:calc(100vh - 156px);margin:auto;padding:36px 40px}.notes-scope .auth-container{min-height:0;padding:0}.notes-scope .auth-card{box-shadow:none;border:1px solid #dce2ec}.notes-scope .auth-card h1{color:#202a3c;font-size:2rem}.notes-scope .header{color:#202a3c}.notes-scope .header h1{text-shadow:none}.notes-scope .header-content,.notes-scope .main{max-width:1200px}.notes-scope .btn-primary{background:#2458df}.notes-scope .btn{font-size:.9375rem}.notes-scope .btn-small{color:#253148;background:#fff;border:1px solid #d6dce6}.notes-scope .btn-logout{color:#b52f38}.notes-scope .note-textarea{box-shadow:none;border:1px solid #dce2ec}.notes-scope .footer{color:#6c778c}.notes-scope .qr-card{box-shadow:none;border:1px solid #dce2ec}.notes-scope .subtitle strong{background:#e7edfa}.scanner-card .btn{width:auto;margin-top:12px}.scanner-card h2{font-size:1.4rem}@media (width<=1000px){.tool-grid{grid-template-columns:repeat(2,1fr)}.page-heading{flex-direction:column;align-items:flex-start}.home{padding-top:48px}.composer{flex-wrap:wrap}.name-field{width:100%}.message-field{min-width:60%}}@media (width<=640px){.shell-header{height:72px;padding:0 20px}.brand-light{display:none}.home,.workspace{padding:32px 20px}.home h1{font-size:2.5rem}.tool-grid{grid-template-columns:1fr;gap:12px;margin-top:30px}.tool-card{min-height:230px;padding:22px}.card-top{margin-bottom:20px}.home-footer{gap:20px;margin-top:32px}.editor-grid,.join-grid{grid-template-columns:1fr}.editor-panel textarea{height:300px}.tool-nav{gap:0;padding:8px}.tool-nav a{padding:8px 10px;font-size:.8125rem}.join-panel{padding:24px}.join-grid{margin:20px 0}.room-bar{flex-direction:column;align-items:flex-start}.room-bar button{padding:8px 10px}.message{max-width:95%}.messages{padding:14px}.notes-scope .app{padding:24px 16px}.notes-scope .auth-card{padding:24px}.panel-bar{flex-wrap:wrap;padding:10px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.jwt-input textarea{height:150px}.jwt-notice{color:#795511;background:#fff8e7;border:1px solid #ead29e;border-radius:10px;margin:20px 0;padding:14px 18px;font-size:.875rem}.jwt-claims{background:#fff;border:1px solid #dce2ec;border-radius:12px;margin-top:24px;padding:24px}.jwt-claims h2{margin-bottom:16px}.jwt-claims dl>div{border-bottom:1px solid #edf0f5;justify-content:space-between;gap:20px;padding:12px 0;display:flex}.jwt-claims dd{overflow-wrap:anywhere;margin:0}.jwt-claims strong{margin-left:12px;font-size:.875rem;display:inline-block}.jwt-claims p{color:#6c778c;margin-top:14px;font-size:.875rem}@media (width>=1200px){.tool-grid{grid-template-columns:repeat(5,1fr)}.tool-card{padding:20px}}@media (width<=640px){.jwt-claims dl>div{flex-direction:column;gap:6px}}.text-toolbar{flex-wrap:wrap;gap:20px;margin-bottom:24px;display:flex}.text-toolbar fieldset{border:0;min-width:0;margin:0;padding:0}.text-toolbar legend{color:#657189;margin-bottom:8px;font-size:.875rem}.text-counts{flex-wrap:wrap;gap:18px;display:flex}.text-operation{color:#657189;font-weight:400}.text-help{color:#657189;max-width:880px;margin-top:18px;font-size:.875rem}@media (width>=1001px){.tool-grid{grid-template-columns:repeat(3,1fr)}}