:root{color:#071b38;background:#eef3f9;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;background:#eef3f9}button,input,select{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.app-shell{width:min(900px,calc(100% - 36px));margin:0 auto;padding:20px 0 32px}.brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:24px}.brand-icon{display:grid;width:52px;height:52px;place-items:center;flex:0 0 auto;border-radius:0;background:transparent;box-shadow:none}.brand-icon svg{width:100%;height:100%}.brand h1{margin:0;color:#061a35;font-size:27px;line-height:1.05;font-weight:800;letter-spacing:0}.brand p{margin:5px 0 0;color:#60738d;font-size:15px}.tool-card,.info-card,.single-card{border:1px solid #dce5ef;background:#fff;box-shadow:0 2px 8px #0c1c300d}.tool-card{border-radius:18px;padding:30px 34px}.field-block label,.advanced-grid span{display:block;margin-bottom:9px;font-size:15px;font-weight:800;color:#0a1d3b}.input-shell{position:relative}.input-shell input{width:100%;height:48px;padding:0 56px 0 18px;border:1px solid #d6e0eb;border-radius:12px;outline:none;background:#f8fbff;color:#061a35;font-family:SF Mono,Monaco,Courier New,monospace;font-size:15px;font-weight:800;letter-spacing:0;transition:border-color .15s ease,box-shadow .15s ease}.input-shell input:focus,.advanced-grid input:focus,.advanced-grid select:focus{border-color:#8ccfff;box-shadow:0 0 0 4px #1e88e51f}.icon-button{display:inline-grid;width:36px;height:36px;place-items:center;border:0;border-radius:10px;background:#e6edf6;color:#66768b}.icon-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.input-clear{position:absolute;top:6px;right:8px}.action-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}.primary-action{min-height:46px;border:0;border-radius:10px;color:#fff;font-size:15px;font-weight:800;box-shadow:0 2px #00000008;transition:transform .15s ease,filter .15s ease}.primary-action:hover{filter:brightness(1.03);transform:translateY(-1px)}.blue{background:#3b82f6}.cyan{background:#0f98ae}.green{background:#059669}.advanced-panel{margin-top:18px;overflow:hidden;border:1px solid #d8e7f4;border-radius:14px;background:#f8fbff}.advanced-panel summary{display:flex;min-height:46px;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;color:#0b2447;font-weight:800;list-style:none;cursor:pointer}.advanced-panel summary::-webkit-details-marker{display:none}.advanced-panel summary:after{content:"+";display:grid;width:26px;height:26px;place-items:center;flex:0 0 auto;border-radius:8px;background:#e6edf6;color:#4e6078}.advanced-panel[open] summary:after{content:"-"}.advanced-panel strong{margin-left:auto;color:#60738d;font-size:13px;font-weight:700}.advanced-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding:14px;border-top:1px solid #d8e7f4}.advanced-grid span{margin-bottom:7px;color:#52677e;font-size:13px}.advanced-grid input,.advanced-grid select{width:100%;height:42px;padding:0 12px;border:1px solid #d6e0eb;border-radius:10px;outline:none;background-color:#fff;color:#0a1d3b;box-shadow:0 1px #0c1c3005;transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}.advanced-grid select{padding-right:34px;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#0b2447 50%),linear-gradient(135deg,#0b2447 50%,transparent 50%);background-position:calc(100% - 17px) 18px,calc(100% - 11px) 18px;background-repeat:no-repeat;background-size:6px 6px}.advanced-grid input::placeholder{color:#91a3ba;opacity:1}.advanced-grid input:placeholder-shown{background-color:#fbfdff}.status-line{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:#edfdf7;color:#047857;font-weight:700}.status-line[data-kind=error]{background:#fff1f1;color:#d72f2f}.token-panel{position:relative;margin-top:24px;padding:38px 26px 24px;border:1px solid #ace0ff;border-radius:16px;background:#eef9ff;text-align:center}.panel-title{position:absolute;top:22px;left:26px;margin:0;color:#075ea7;font-size:14px;font-weight:800}.token-value{display:block;width:100%;min-height:68px;border:0;background:transparent;color:#1f42b3;font-family:SF Mono,Monaco,Courier New,monospace;font-size:43px;line-height:1.15;font-weight:800;letter-spacing:0;text-align:center}.copy-hint{margin:2px 0 0;color:#64748b;font-size:13px;font-weight:700}.timer-panel{margin-top:16px;padding:20px 24px;border:1px solid #ffd35a;border-radius:16px;background:#fff9e8}.timer-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;color:#8a330c;font-size:15px;font-weight:800}.timer-head strong{color:#8a330c;font-family:SF Mono,Monaco,Courier New,monospace;font-size:27px;line-height:1;font-weight:800}.timer-track{height:7px;margin-top:14px;overflow:hidden;border-radius:999px;background:#ffffffe6}.timer-fill{width:100%;height:100%;border-radius:inherit;background:#f59e0b;transition:width .25s linear}.qr-panel{position:relative;margin-top:16px;padding:26px 24px 24px;border:1px solid #62e3cf;border-radius:16px;background:#effffb;text-align:center}.qr-panel h2{margin:0 0 22px;color:#008f83;font-size:16px;text-align:left}.qr-close{position:absolute;top:22px;right:24px;background:#fff;color:#009688}#qrCanvas{display:block;width:210px;height:210px;margin:0 auto;border-radius:12px;background:#fff;box-shadow:0 2px 12px #0c1c301a}.qr-panel p{margin:22px 0 0;color:#008f83;font-size:14px;font-weight:800}.saved-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:28px;padding-top:22px;border-top:1px solid #dce5ef}.saved-head h2,.info-card h2{margin:0;color:#061a35;font-size:18px}.danger-button{min-width:96px;height:36px;border:1px solid #ff3b3b;border-radius:10px;background:#fff;color:#ff3131;font-weight:800}.saved-list{display:grid;gap:10px;margin-top:12px}.empty-state{margin:0;color:#8da0b6}.saved-item{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:10px;border:1px solid #dce5ef;border-radius:12px;background:#f8fbff}.saved-use{display:grid;justify-items:start;border:0;background:transparent;color:#0a1d3b;text-align:left}.saved-use strong{font-size:14px;letter-spacing:0}.saved-use[data-has-label=false] strong{font-family:SF Mono,Monaco,Courier New,monospace}.saved-use span{margin-top:3px;color:#60738d;font-size:13px}.saved-open,.saved-delete{display:inline-grid;min-width:54px;height:34px;place-items:center;border-radius:8px;font-size:14px;font-weight:800;text-decoration:none}.saved-open{border:1px solid #b5dcff;background:#eff7ff;color:#0576b8}.saved-delete{border:1px solid #ffd2d2;background:#fff6f6;color:#d72f2f}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.info-card{min-height:250px;border-radius:14px;padding:24px 26px}.demo-callout{display:grid;width:100%;gap:9px;margin-top:20px;padding:16px;border:1px solid #ace0ff;border-radius:12px;background:#eef9ff;color:#60738d;text-align:left}.demo-callout strong{justify-self:start;padding:8px 14px;border-radius:8px;background:#3b82f6;color:#fff;font-family:SF Mono,Monaco,Courier New,monospace;letter-spacing:0}.demo-callout em{font-style:normal;color:#60738d}.check-list,.warn-list{display:grid;gap:12px;margin:18px 0 0;padding:0;color:#53677f;font-size:14px;line-height:1.55;list-style:none}.check-list li,.warn-list li{position:relative;padding-left:28px}.check-list li:before{content:"✓";position:absolute;left:0;color:#10b981;font-weight:900}.warn-list li:before{content:"!";position:absolute;left:0;color:#f59e0b;font-weight:900}.check-list code{font-family:SF Mono,Monaco,Courier New,monospace;font-size:13px}.safety-card{border-color:#ffb7b7}footer{margin-top:32px;color:#93a4ba;text-align:center}.toast{position:fixed;left:50%;bottom:24px;z-index:20;min-width:150px;max-width:min(360px,calc(100% - 32px));padding:10px 14px;border-radius:12px;background:#0f172a;color:#fff;text-align:center;box-shadow:0 10px 24px #0f172a33;transform:translate(-50%)}.save-dialog{width:min(400px,calc(100% - 32px));padding:0;border:1px solid #dce5ef;border-radius:16px;background:#fff;color:#071b38;box-shadow:0 22px 70px #0f172a2e}.save-dialog::backdrop{background:#0f172a47}.save-dialog form{display:grid;gap:16px;padding:24px}.save-dialog h2{margin:0;font-size:20px}.dialog-copy{margin:0;color:#53677f;font-size:14px;line-height:1.6}.dialog-field{display:grid;gap:8px}.dialog-field span{color:#0a1d3b;font-size:15px;font-weight:800}.dialog-field input{width:100%;height:42px;padding:0 12px;border:1px solid #d6e0eb;border-radius:10px;outline:none;background:#fbfdff;color:#0a1d3b}.dialog-field input:focus{border-color:#8ccfff;box-shadow:0 0 0 4px #1e88e51f}.dialog-field input::placeholder{color:#91a3ba}.dialog-actions{display:flex;justify-content:flex-end;gap:10px}.dialog-cancel,.dialog-confirm{min-width:82px;height:38px;border-radius:10px;font-weight:800}.dialog-cancel{border:1px solid #d6e0eb;background:#fff;color:#53677f}.dialog-confirm{border:0;background:#059669;color:#fff}.single-page{min-height:100vh}.single-shell{display:grid;min-height:100vh;place-items:center;padding:34px 18px}.single-card{width:min(470px,100%);border-radius:18px;padding:38px 42px;text-align:center;box-shadow:0 20px 50px #19283e14}.single-icon{width:60px;height:60px;margin:0 auto 22px;border-radius:0}.single-card h1{margin:0 0 22px;color:#061a35;font-size:22px;font-weight:800;letter-spacing:0}.single-token-box{display:block;width:100%;min-height:132px;padding:22px 18px 18px;border:1px solid #ace0ff;border-radius:16px;background:#eef9ff;color:#1f42b3;text-align:center}.single-token-box span{display:block;margin-bottom:18px;color:#075ea7;font-size:14px;font-weight:800}.single-token-box strong{display:block;font-family:SF Mono,Monaco,Courier New,monospace;font-size:42px;line-height:1.1;font-weight:800;letter-spacing:0}.single-token-box.is-invalid{border-color:#ffb7b7;background:#fff6f6;color:#d72f2f}.single-timer-box{margin-top:16px;padding:16px 22px;border:1px solid #ffd35a;border-radius:16px;background:#fff9e8}.single-timer-box p{margin:0;color:#8a330c;font-size:16px;font-weight:800}.single-timer-box strong{font-family:SF Mono,Monaco,Courier New,monospace;font-size:22px}.single-track{margin-top:12px}.single-copy-hint{margin:18px 0 0;color:#94a3b8;font-size:14px;font-weight:800}.single-help{margin-top:6px;text-align:left}.single-help h2{margin:0 0 14px;color:#061a35;font-size:18px}.single-help p{margin:14px 0 10px;color:#53677f;line-height:1.6}.single-help code{display:block;overflow-wrap:anywhere;padding:12px 14px;border:1px solid #d8e7f4;border-radius:10px;background:#f8fbff;color:#075ea7;font-family:SF Mono,Monaco,Courier New,monospace;font-size:13px}.single-help dl{display:grid;gap:8px;margin:0 0 14px}.single-help dl div{display:grid;grid-template-columns:88px 1fr;gap:12px}.single-help dt{color:#0a1d3b;font-family:SF Mono,Monaco,Courier New,monospace;font-weight:800}.single-help dd{margin:0;color:#60738d}@media(max-width:980px){.app-shell{width:min(700px,calc(100% - 28px))}.tool-card{padding:28px 24px}.action-row,.info-grid{grid-template-columns:1fr}.advanced-grid{grid-template-columns:repeat(2,1fr)}.info-card{min-height:auto}}@media(max-width:640px){.app-shell{width:min(100% - 24px,520px);padding-top:18px}.brand{align-items:flex-start;justify-content:flex-start;gap:12px;margin-bottom:20px}.brand-icon{width:50px;height:50px;border-radius:0}.brand h1{font-size:25px}.brand p{font-size:14px}.tool-card,.info-card{border-radius:16px;padding:22px 16px}.input-shell input{height:48px;font-size:15px}.advanced-panel summary{align-items:flex-start;flex-direction:column;padding:14px 16px}.advanced-panel summary:after{position:absolute;right:16px}.advanced-panel strong{margin-left:0}.advanced-grid{grid-template-columns:1fr}.token-panel{padding:48px 14px 22px}.panel-title{left:18px}.token-value{min-height:64px;font-size:34px}.timer-panel,.qr-panel{padding:22px 16px}.timer-head strong{font-size:26px}.saved-head{align-items:flex-start;flex-direction:column}.saved-item{grid-template-columns:1fr 1fr}.saved-use{grid-column:1 / -1}.single-shell{align-items:center;padding:24px 14px}.single-card{padding:32px 22px}.single-token-box strong{font-size:36px}.single-token-box{min-height:126px}.single-help dl div{grid-template-columns:1fr;gap:4px}}