@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#151515;--panel:#202020;--panel2:#282828;--text:#f7f7f2;--muted:#9b9b98;--line:#393939;--accent:#e6f26b;--accent-ink:#20220c}*{box-sizing:border-box}body{margin:0;background:#0d0d0d;color:var(--text);font-family:Manrope,Arial,sans-serif}.app-shell{min-height:100vh;background:var(--bg);display:flex}.sidebar{width:264px;background:#101010;border-right:1px solid #292929;display:flex;flex-direction:column;padding:30px 16px;transition:.3s transform}.brand{font-size:21px;font-weight:800;letter-spacing:-1px;display:flex;gap:9px;align-items:center;padding:0 10px 42px}.brand-mark{height:29px;width:29px;border-radius:9px;background:var(--accent);color:#181818;display:grid;place-items:center;font-family:Georgia;font-size:26px}.nav-caption,.eyebrow{font:11px 'DM Mono';letter-spacing:1.3px;color:#747470;margin:0 10px 10px}.nav-item{border:0;background:transparent;color:#b5b5b1;text-align:left;font:600 14px Manrope;padding:13px 12px;border-radius:10px;margin:2px 0;cursor:pointer}.nav-item span{font-size:19px;display:inline-block;width:29px;vertical-align:-2px}.nav-item.active,.nav-item:hover{background:#292929;color:#fff}.nav-item.active{color:var(--accent)}.sidebar-foot{margin-top:auto;color:#777;font:12px 'DM Mono';padding:10px}.sidebar-foot span{color:#555}.workspace{width:100%;max-width:970px;margin:0 auto;padding:0 42px 45px}.topbar{height:86px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px}.topbar h1{font-size:18px;margin:0;font-weight:700;letter-spacing:-.4px}.menu-button,.more-button{background:none;color:#ddd;border:0;font-size:23px;cursor:pointer}.menu-button{display:none}.more-button{margin-left:auto;font-size:17px;letter-spacing:2px}.page{display:none;animation:enter .25s ease}.page.active{display:block}@keyframes enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.conversion-card{margin:45px 0 24px;background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.amount-row{padding:25px 26px;display:flex;justify-content:space-between;align-items:center;min-height:140px}.amount-row label{font:10px 'DM Mono';color:var(--muted);letter-spacing:1.2px;display:block;margin-bottom:9px}.amount{font-size:40px;letter-spacing:-2px;font-weight:600;max-width:470px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-row{background:#1d1d1d}.result-row .amount{color:var(--accent)}.currency-button{border:0;background:#303030;color:#f1f1ed;padding:10px 12px;border-radius:10px;text-align:left;display:grid;grid-template-columns:27px auto 12px;grid-template-rows:auto auto;column-gap:7px;cursor:pointer;min-width:150px}.currency-button .flag{grid-row:span 2;font-size:19px}.currency-button small{color:#8e8e89;font:10px 'DM Mono'}.currency-button b{grid-column:3;grid-row:1 / 3;align-self:center;font-size:16px;color:#aaa}.conversion-divider{height:1px;background:#393939;margin:0 26px;position:relative}.conversion-divider span{position:absolute;left:0;top:11px;color:#858580;font:11px 'DM Mono'}.conversion-divider button{position:absolute;right:0;top:-19px;width:39px;height:39px;border:1px solid #4b4b4b;background:#2e2e2e;color:var(--accent);font-size:21px;border-radius:50%;cursor:pointer}.keypad{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.keypad button{height:63px;background:var(--panel2);border:1px solid #353535;border-radius:12px;color:#fff;font:600 19px Manrope;cursor:pointer}.keypad button:hover{background:#363636}.keypad .operator,.keypad .utility{color:var(--accent)}.keypad .equals{background:var(--accent);border-color:var(--accent);color:#1c1d12}.page-intro{margin:41px 0 27px}.page-intro h2,.list-top h2{font-size:29px;letter-spacing:-1.4px;margin:7px 0}.page-intro>p:last-child{color:var(--muted);font-size:14px;margin:0}.form-card,.settings-card{background:var(--panel);border:1px solid var(--line);padding:26px;border-radius:15px}.form-card label{font-size:12px;font-weight:700;color:#c2c2bd;display:block}.form-card input,.form-card select,.list-controls input,.list-controls select,.settings-card select{width:100%;margin-top:8px;background:#2a2a2a;border:1px solid #414141;color:#f4f4ef;border-radius:8px;padding:13px;font:13px Manrope;outline:none}.form-card input:focus,.list-controls input:focus{border-color:var(--accent)}.form-grid{display:grid;grid-template-columns:2fr 1fr;gap:15px;margin-bottom:16px}.rate-toggle{border-top:1px solid var(--line);margin-top:22px;padding-top:21px}.rate-toggle p{font-size:12px;font-weight:700;margin:0 0 10px}.rate-toggle>div{display:flex;gap:8px}.choice{flex:1;background:#2a2a2a;border:1px solid #3c3c3c;border-radius:9px;padding:13px!important;color:#a7a7a2!important;cursor:pointer}.choice.active{border-color:var(--accent);color:var(--accent)!important}.choice input{display:none}.model-fields{padding:21px 0}.field-hint{font-size:12px;color:var(--muted);margin:0 0 15px}.rate-fields{margin:0}.unit-row{display:grid;grid-template-columns:1.2fr .8fr 34px;gap:10px;margin-bottom:9px;align-items:end}.unit-row button{height:42px;border:0;background:transparent;color:#bbb;font-size:20px;cursor:pointer}.primary-button,.secondary-button{border:0;border-radius:9px;padding:13px 16px;font:700 13px Manrope;cursor:pointer}.primary-button{background:var(--accent);color:var(--accent-ink);margin-top:5px}.primary-button span{font-size:17px;margin-left:12px}.secondary-button{background:#303030;color:#eee;border:1px solid #444}.hidden{display:none!important}.list-top{display:flex;align-items:end;justify-content:space-between;margin:41px 0 23px}.compact{margin:0}.list-controls{display:flex;gap:10px;margin-bottom:18px}.search{background:#242424;border:1px solid #3b3b3b;border-radius:9px;display:flex;align-items:center;padding-left:13px;flex:1;color:#888}.search input{border:0!important;background:transparent!important;margin:0!important}.list-controls select{width:170px;margin:0}.currency-list{display:grid;gap:10px}.currency-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:16px;display:flex;align-items:center;gap:14px}.currency-symbol{height:43px;width:43px;background:#303030;border-radius:11px;color:var(--accent);display:grid;place-items:center;font-size:19px;font-weight:700}.currency-info{flex:1}.currency-info h3{font-size:14px;margin:0}.currency-info p{font:11px 'DM Mono';color:var(--muted);margin:3px 0 0}.currency-value{font:12px 'DM Mono';color:#d1d1cb;text-align:right}.currency-actions button{border:0;background:transparent;color:#9d9d98;font:12px Manrope;cursor:pointer;padding:7px}.currency-actions button:hover{color:var(--accent)}.empty-state{text-align:center;padding:72px 20px;background:var(--panel);border:1px dashed #454545;border-radius:15px}.empty-state>div{font-size:31px;color:var(--accent)}.empty-state h3{margin:10px 0 3px}.empty-state p{color:var(--muted);font-size:13px;margin:0 0 17px}.settings-card{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.settings-card h3{font-size:14px;margin:0 0 4px}.settings-card p{font-size:12px;color:var(--muted);margin:0}.settings-card select{width:180px;margin:0}.swatches{display:flex;gap:9px}.swatches button{width:25px;height:25px;border-radius:50%;border:2px solid transparent;background:var(--swatch);cursor:pointer}.swatches button.selected{outline:2px solid #efefea;outline-offset:3px}.danger{margin-top:26px}.modal-backdrop{position:fixed;inset:0;background:#0009;opacity:0;visibility:hidden;transition:.2s;z-index:5}.currency-modal{position:fixed;z-index:6;top:50%;left:50%;width:min(460px,calc(100% - 34px));background:#202020;border:1px solid #484848;border-radius:15px;padding:20px;transform:translate(-50%,-46%);opacity:0;visibility:hidden;transition:.2s}.currency-modal.open,.modal-backdrop.open{opacity:1;visibility:visible}.currency-modal.open{transform:translate(-50%,-50%)}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head h2{font-size:17px;margin:0}.modal-head button{font-size:26px;color:#ccc;background:none;border:0;cursor:pointer}.modal-search{margin:17px 0 12px}.selector-list{height:300px;overflow:auto}.selector-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;border-radius:8px;background:transparent;color:#f2f2ed;padding:11px;cursor:pointer}.selector-item:hover{background:#303030}.selector-item .flag{font-size:19px;width:24px}.selector-item small{display:block;color:var(--muted);font:10px 'DM Mono';margin-top:2px}.selector-item b{margin-left:auto;color:#aaa;font:11px 'DM Mono'}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:var(--accent);color:#1e2010;border-radius:9px;padding:12px 17px;font:700 13px Manrope;opacity:0;transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){.workspace{padding:0 17px 30px}.sidebar{position:fixed;z-index:10;inset:0 auto 0 0;transform:translateX(-100%);box-shadow:20px 0 40px #0009}.sidebar.open{transform:none}.menu-button{display:block}.topbar{height:70px}.amount-row{padding:22px 16px;min-height:125px}.conversion-divider{margin:0 16px}.amount{font-size:31px;max-width:180px}.currency-button{min-width:121px;padding:8px;grid-template-columns:20px auto 9px}.currency-button small{max-width:66px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.keypad button{height:57px}.form-grid{grid-template-columns:1fr}.settings-card{gap:16px}.settings-card p{display:none}.list-top{margin-top:30px}}
.amount{transition:font-size .15s;min-width:0}.amount.compact{letter-spacing:-1.5px}.rate-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.unit-row{grid-template-columns:1.2fr .8fr 1fr 34px}.unit-row .unit-base{display:none}.unit-row:first-child .unit-base{display:block}@media(max-width:700px){.rate-row,.unit-row{grid-template-columns:1fr}.unit-row button{justify-self:end}.amount.compact{letter-spacing:-.8px}}
.appearance-card{margin-bottom:12px}.mode-toggle{display:flex;gap:5px;background:var(--panel2);padding:4px;border-radius:9px}.mode-toggle button{border:0;border-radius:6px;padding:8px 10px;background:transparent;color:var(--muted);font:700 11px Manrope;cursor:pointer}.mode-toggle button.selected{background:var(--accent);color:#151515}.theme-section{margin:25px 0}.theme-section>h3{font-size:15px;margin:0 0 3px}.theme-section>p{font-size:12px;color:var(--muted);margin:0 0 13px}.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.theme-grid button{min-height:76px;text-align:left;border:1px solid var(--line);border-radius:11px;padding:12px;background:var(--panel);color:var(--text);cursor:pointer;position:relative;overflow:hidden}.theme-grid button:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:var(--accent)}.theme-grid button b,.theme-grid button span{display:block;position:relative}.theme-grid button b{font-size:12px}.theme-grid button span{font:10px 'DM Mono';color:var(--muted);margin-top:4px}.theme-grid button.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}body[data-theme="emperor"] .theme-grid button.selected:before{background:#d9ad2d}body[data-theme="dragon"] .theme-grid button.selected:before{background:#9e2020}body[data-theme="cherry"] .theme-grid button.selected:before{background:#ff5b8a}body[data-theme="forest"] .theme-grid button.selected:before{background:#3f9656}body[data-theme="ocean"] .theme-grid button.selected:before{background:#4eb8f0}body[data-theme="rainbow-strobe"] .theme-grid button.selected:before,body[data-theme="rainbow-road"] .theme-grid button.selected:before{background:linear-gradient(90deg,#f22,#ff0,#2f4,#2cf,#b4f,#f2a);background-size:250% 100%;animation:rainbow 2s linear infinite}body[data-theme="fall-strobe"] .theme-grid button.selected:before,body[data-theme="fall-road"] .theme-grid button.selected:before{background:linear-gradient(90deg,#e42,#f80,#fe3);background-size:250% 100%;animation:rainbow 2s linear infinite}body[data-theme="rainbow-strobe"]{animation:strobe 1.2s steps(1) infinite}body[data-theme="fall-strobe"]{animation:fallStrobe 1.3s steps(1) infinite}body[data-theme="rainbow-road"] .result-row .amount,body[data-theme="rainbow-strobe"] .result-row .amount{background:linear-gradient(90deg,#f33,#fd3,#3d4,#4df,#b5f,#f4a);background-size:300% auto;background-clip:text;color:transparent;animation:rainbow 2.5s linear infinite}body[data-theme="fall-road"] .result-row .amount,body[data-theme="fall-strobe"] .result-row .amount{background:linear-gradient(90deg,#e42,#f80,#fe3);background-size:300% auto;background-clip:text;color:transparent;animation:rainbow 2.5s linear infinite}@keyframes rainbow{to{background-position:300% 0}}@keyframes strobe{0%,100%{--accent:#ff4d4d}25%{--accent:#fff04d}50%{--accent:#4dff79}75%{--accent:#58b6ff}}@keyframes fallStrobe{0%,100%{--accent:#ee3f2f}33%{--accent:#ff8b1f}66%{--accent:#ffe33d}}@media(max-width:820px){.workspace{padding-left:26px;padding-right:26px}.theme-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.workspace{padding-left:14px;padding-right:14px}.theme-grid{grid-template-columns:1fr 1fr}.appearance-card{align-items:flex-start;flex-direction:column}.settings-card{align-items:flex-start;flex-direction:column}.mode-toggle{width:100%}.mode-toggle button{flex:1}.amount-row{gap:8px}.amount{max-width:calc(100vw - 170px)}}
.unit-entry{margin-top:13px;max-width:480px}.unit-entry details{background:var(--panel2);border:1px solid var(--line);border-radius:8px}.unit-entry summary{padding:9px 11px;list-style:none;font:11px 'DM Mono';color:var(--accent);cursor:pointer;display:flex;justify-content:space-between}.unit-entry summary::-webkit-details-marker{display:none}.unit-entry-list{padding:0 10px 10px;display:grid;grid-template-columns:repeat(3,minmax(110px,1fr));gap:7px;max-height:190px;overflow:auto}.unit-entry-list label{margin:0!important;font:10px 'DM Mono'!important;color:var(--muted)!important;letter-spacing:0!important}.unit-entry-list label span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.unit-entry-list input{width:100%;margin-top:4px;background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:5px;padding:7px;font:13px Manrope;outline:none}.unit-entry-list input:focus{border-color:var(--accent)}.unit-row{grid-template-columns:1.2fr .8fr 1fr 34px 30px}.drag-handle{height:42px;border:0!important;background:transparent!important;color:var(--muted)!important;cursor:grab;font-size:20px;touch-action:none}.drag-handle:active,.dragging-unit .drag-handle{cursor:grabbing}.unit-row.drag-over{outline:1px dashed var(--accent);outline-offset:3px;border-radius:6px}@media(max-width:600px){.unit-entry-list{grid-template-columns:repeat(2,minmax(0,1fr))}.input-row{align-items:flex-start}.unit-row{grid-template-columns:1fr 1fr 34px 30px}.unit-row .unit-base{grid-column:1 / -1}}