:root{color:#f7f2ec;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--bg:#0b0910;--panel:#18131fe0;--panel-strong:#241b2df5;--line:#ffffff1f;--muted:#aaa2b8;--text:#f7f2ec;--acid:#d6ff4f;--amber:#ffb84d;--red:#ff355d;--cyan:#73f4ff;--shadow:0 20px 50px #0000005c;--ease-out:cubic-bezier(.2, .8, .2, 1);--focus-ring:0 0 0 4px #d6ff4f1c;background:#0b0910;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box;-webkit-user-select:none;user-select:none}body{background:radial-gradient(circle at 18% 4%,#d6ff4f21,#0000 25rem),radial-gradient(circle at 86% 0,#ff355d29,#0000 28rem),linear-gradient(145deg,#0b0910 0%,#14111c 58%,#08070b 100%);min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}input,textarea,select,option,code,pre,.selectable{-webkit-user-select:text;user-select:text}button{cursor:pointer;-webkit-tap-highlight-color:transparent;border:0}button:disabled{cursor:not-allowed;opacity:.52}button:focus-visible,summary:focus-visible{outline-offset:3px;outline:3px solid #d6ff4f6b}button:active:not(:disabled){transform:translateY(0)}code{color:var(--acid)}.app-shell{width:min(1520px,100% - 24px);margin:0 auto;padding:14px 0 22px}.panel{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:22px;padding:18px}.top-panel{grid-template-columns:minmax(0,1fr) minmax(300px,360px);align-items:center;gap:16px;margin-bottom:14px;display:grid;position:relative;overflow:hidden}.top-panel:after{content:"";pointer-events:none;background:radial-gradient(circle,#d6ff4f2e,#0000 68%);width:22rem;height:22rem;position:absolute;inset:auto -8rem -10rem auto}.title-block{z-index:1;position:relative}.title-button{all:unset;cursor:pointer;transition:color .16s ease, text-shadow .16s ease, transform .16s var(--ease-out);border-radius:12px;display:inline-block}.title-button:hover{color:var(--acid);text-shadow:0 0 22px #d6ff4f38;transform:translateY(-1px)}.title-button:focus-visible{outline-offset:5px;outline:3px solid #d6ff4f7a}h1,h2,h3{margin:0;line-height:1.05}h1{letter-spacing:0;font-size:3.45rem;line-height:1.12}h2{letter-spacing:0;font-size:1.12rem}h3{color:#fff;margin-top:16px;font-size:.92rem}.hint,.summary{color:var(--muted);line-height:1.45}.write-card{z-index:1;border:1px solid var(--line);background:linear-gradient(140deg,#ff355d38,#d6ff4f1a);border-radius:18px;grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:12px;display:grid;position:relative}.slot-count{gap:1px;min-width:82px;display:grid}.slot-count span{color:var(--acid);letter-spacing:0;font-size:3rem;font-weight:1000;line-height:1}.slot-count small{color:var(--muted)}.big-red{color:#190407;background:linear-gradient(135deg, var(--red), #ff8a35);letter-spacing:0;text-transform:uppercase;border-radius:18px;width:100%;padding:18px 22px;font-size:1.2rem;font-weight:1000;box-shadow:0 18px 46px #ff355d40}.cancel-button{grid-column:1/-1}.progress-mini{color:var(--muted);grid-column:1/-1;gap:6px;font-size:.78rem;font-weight:800;display:grid}.progress-mini div{border:1px solid var(--line);background:#ffffff0d;border-radius:999px;height:10px;overflow:hidden}.progress-mini i{background:linear-gradient(90deg, var(--acid), var(--cyan));height:100%;display:block}.app-modal{z-index:999;place-items:center;padding:12px;display:grid;position:fixed;inset:0}.modal-backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);width:100%;height:100%;animation:fade-in .16s var(--ease-out);background:#00000094;position:absolute;inset:0}.modal-dialog{width:min(580px,100%);max-height:min(88vh,720px);color:var(--text);background:linear-gradient(180deg, #1b1522fa, #0e0b13fa), var(--panel-strong);animation:modal-in .18s var(--ease-out);border:1px solid #ffffff29;border-radius:18px;position:relative;overflow:auto;box-shadow:0 30px 120px #00000094}.modal-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:14px 16px 12px;display:flex}.modal-header h2{font-size:1rem}.modal-close{width:34px;height:34px;color:var(--text);border:1px solid var(--line);background:#ffffff12;border-radius:999px;font-weight:1000;line-height:1}.modal-close:hover{border-color:#d6ff4f66}.modal-body{gap:10px;padding:15px 16px 8px;display:grid}.modal-body p{color:#ddd7e8;margin:0;line-height:1.46}.license-note{background:#d6ff4f12;border:1px solid #d6ff4f33;border-radius:14px;gap:6px;margin-top:4px;padding:10px 12px;display:grid}.license-note strong{color:#fff;font-size:.92rem;line-height:1.38}.modal-notes{color:var(--muted);margin:0;padding-left:18px;line-height:1.45}.about-support{border-top:1px solid var(--line);gap:10px;margin-top:6px;padding-top:14px;display:grid}.about-support-copy{color:#fff;font-weight:900}.kofi-frame{background:#f9f9f9;border:0;border-radius:12px;width:100%;height:min(520px,62vh);min-height:360px;display:block}.modal-footer{justify-content:flex-end;padding:8px 16px 16px;display:flex}.modal-ok{min-width:96px}.workspace{grid-template-columns:minmax(300px,360px) minmax(0,1fr);align-items:start;gap:14px;display:grid}.setup-panel,.main-panel{min-height:calc(100vh - 170px)}.setup-panel{flex-direction:column;display:flex}.panel-heading{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.compact-heading{align-items:center}label{color:#ddd7e8;gap:6px;margin:10px 0;font-size:.84rem;font-weight:800;display:grid}input,select{width:100%;color:var(--text);border:1px solid var(--line);background:#100d17;border-radius:12px;outline:none;padding:10px 11px;transition:border-color .16s,background .16s,box-shadow .16s}input:focus,select:focus{box-shadow:var(--focus-ring);background:#14101d;border-color:#d6ff4fa6}input[type=range]{accent-color:var(--acid);padding:0}small{color:var(--muted)}.secondary,.segmented button,.tabbar button{color:var(--text);border:1px solid var(--line);transition:color .16s ease, transform .16s var(--ease-out), border-color .16s ease, background .16s ease, box-shadow .16s ease;background:#ffffff0f;border-radius:999px;padding:8px 12px;font-weight:900}.secondary:hover,.segmented button:hover,.tabbar button:hover{background:#ffffff16;border-color:#d6ff4f59;transform:translateY(-1px);box-shadow:0 8px 18px #00000024}.secondary.subtle{background:#ffffff0a;padding:7px 10px;font-size:.78rem}.secondary.danger{color:#ffd3dc;border-color:#ff355d47}.segmented,.status-row,.button-row,.check-row,.quick-ranges{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.segmented{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;margin:10px 0;display:grid}.segmented button{width:100%}.segmented button.active,.tabbar button.active{background:var(--acid);color:#121212;border-color:var(--acid);box-shadow:0 8px 18px #d6ff4f1f}.status-row{margin:10px 0}.status-pill{border:1px solid var(--line);border-radius:999px;align-items:center;gap:6px;padding:7px 10px;font-size:.78rem;font-weight:900;display:inline-flex}.status-pill:before{content:"";background:currentColor;border-radius:50%;width:8px;height:8px}.status-pill.ok{color:var(--acid);background:#d6ff4f12}.status-pill.not-ok{color:var(--amber);background:#ffb84d14}.button-row{margin-top:12px}.button-row.no-margin{justify-content:flex-end;margin-top:0}.dump-map{margin-top:12px}.dump-map-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:8px;display:grid}.map-toggle{text-align:center}.setup-panel>.button-row{grid-template-columns:1fr;gap:8px;margin-top:10px;display:grid}.setup-panel .dump-map-toolbar .secondary,.setup-panel>.button-row .secondary{background:#ffffff0b;border-radius:12px;justify-content:center;min-height:38px;padding:9px 11px;font-size:.83rem;line-height:1.14;box-shadow:inset 0 1px #ffffff06}.setup-panel .dump-map-toolbar .secondary:hover,.setup-panel>.button-row .secondary:hover{background:#fff1;border-color:#d6ff4f47;box-shadow:inset 0 1px #ffffff0a,0 8px 18px #0000001f}.setup-panel .secondary:disabled{opacity:1;color:#f7f2ec6b;box-shadow:none;background:#ffffff06;border-color:#ffffff14}.setup-panel .secondary:disabled:hover{box-shadow:none;background:#ffffff06;border-color:#ffffff14;transform:none}.map-list{border:1px solid var(--line);background:#ffffff08;border-radius:14px;gap:7px;margin-top:8px;padding:9px;display:grid}.map-empty{margin:0}.map-entry,.map-footer{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;display:grid}.map-entry{background:#ffffff09;border:1px solid #ffffff14;border-radius:12px;padding:8px;transition:border-color .16s,background .16s}.map-entry:hover{background:#ffffff0d;border-color:#ffffff24}.map-entry-main{gap:2px;min-width:0;display:grid}.map-entry-main strong,.map-entry-main span,.map-footer span{overflow-wrap:anywhere}.map-entry-main strong{color:var(--acid);font-size:.78rem;line-height:1.25}.map-entry-main span,.map-footer span{color:var(--muted);font-size:.78rem;line-height:1.3}.map-remove{padding:6px 9px;font-size:.76rem}.grid{gap:12px;display:grid}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.compact{gap:10px;margin-top:10px}.range-select-grid{grid-template-columns:1fr}.tabbar-row{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px;padding-bottom:12px;display:flex}.tabbar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.tab-content{scrollbar-color:#d6ff4f47 #ffffff0a;scrollbar-width:thin;max-height:calc(100vh - 235px);padding:3px 4px 3px 0;overflow:auto}.recipe-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;display:grid}.recipe-card{text-align:left;color:var(--text);border:1px solid var(--line);min-height:62px;transition:transform .18s var(--ease-out), border-color .18s ease, background .18s ease, box-shadow .18s ease;background:#ffffff0b;border-radius:16px;align-items:center;padding:13px;display:grid;position:relative;box-shadow:inset 0 1px #ffffff08}.recipe-card strong{color:#fff;font-size:.98rem;transition:color .18s}.recipe-card:hover{z-index:1;background:#ffffff0f;border-color:#d6ff4f3d;transform:translateY(-1px);box-shadow:inset 0 1px #ffffff0d,0 12px 28px #00000029}.recipe-card:hover strong{color:#fffbd7}.recipe-card.active{background:#d6ff4f1a;border-color:#d6ff4fa6;box-shadow:inset 0 1px #ffffff0f,0 0 0 1px #d6ff4f0a}.recipe-card.local{border-style:dashed}.recipe-card small{color:var(--cyan);font-size:.72rem;font-weight:900}.manual-grid,.activity-grid{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:18px;display:grid}.slider-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin:12px 0;display:grid}.recipe-shape-controls{align-items:center;gap:10px;margin:12px 0 14px;display:flex}.shape-toggle{color:#fff;background:#d6ff4f12;border:1px solid #d6ff4f47;border-radius:14px;align-items:center;gap:8px;margin:0;padding:10px 12px;display:flex}.shape-toggle input{width:auto;accent-color:var(--acid)}.manual-current-recipe{margin:0}.manual-recipe-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.slider-label span{justify-content:space-between;gap:12px;display:flex}.slider-label strong{color:var(--acid)}.check-row{margin-top:12px}.check-row label{color:var(--muted);align-items:center;gap:8px;margin:0;font-size:.84rem;display:flex}.check-row input{width:auto;accent-color:var(--acid)}.quick-ranges{margin:8px 0 12px}.advanced{border:1px solid var(--line);background:#ffffff08;border-radius:16px;margin-top:14px;padding:11px 12px}.advanced,.sysex-preview{transition:border-color .16s,background .16s}.advanced:hover,.sysex-preview:hover{background:#ffffff0a;border-color:#ffffff2e}.sysex-preview{border:1px solid var(--line);background:#ffffff08;border-radius:16px;margin-top:14px;padding:11px 12px}summary{cursor:pointer;color:#fff;font-weight:900}.step-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-top:12px;display:grid}.step-card{border:1px solid var(--line);background:#ffffff0b;border-radius:14px;flex-direction:column;gap:2px;min-height:96px;padding:9px;transition:border-color .16s,background .16s,opacity .16s;display:flex}.step-card.active{border-color:#d6ff4f57}.step-card.active:hover{background:#ffffff0e;border-color:#d6ff4f7a}.step-card.inactive{opacity:.42}.step-card.rest{background:#ff355d14}.step-number{color:var(--acid);font-size:.78rem;font-weight:1000}.step-card strong{font-size:1rem}.flags{grid-template-columns:repeat(4,1fr);gap:3px;margin-top:auto;display:grid}.flags span{text-align:center;border:1px solid var(--line);color:#ffffff5c;border-radius:999px;padding:2px 0;font-size:.58rem}.flags span.on{color:#111;background:var(--acid);border-color:var(--acid);font-weight:1000}.sysex-preview pre{white-space:pre-wrap;word-break:break-word;color:#cbeeff;max-height:260px;font-family:SFMono-Regular,Consolas,monospace;font-size:.7rem;line-height:1.42;overflow:auto}.log-list{gap:7px;max-height:calc(100vh - 330px);display:grid;overflow:auto}.log{border:1px solid var(--line);color:var(--muted);background:#ffffff0a;border-radius:12px;margin:0;padding:9px 11px;font-size:.86rem;line-height:1.32;transition:border-color .16s,background .16s}.log:hover{background:#ffffff0e}.log.ok{color:#eaffbd;border-color:#d6ff4f33}.log.warn{color:#ffe3b5;border-color:#ffb84d3d}.log.error{color:#ffd3dc;border-color:#ff355d59}.log.info{color:#d6f9ff;border-color:#73f4ff33}.mini-list{gap:5px;max-height:calc(100vh - 330px);display:grid;overflow:auto}.mini-list p{color:var(--muted);margin:0;font-size:.86rem;line-height:1.38}.mini-list strong{color:var(--acid)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#ffffff09;border-radius:999px}::-webkit-scrollbar-thumb{background:#d6ff4f3d padding-box content-box;border:3px solid #0000;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#d6ff4f61 padding-box content-box;border:3px solid #0000}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-in{0%{opacity:0;transform:translateY(6px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (max-width:1180px){.workspace,.top-panel,.manual-grid,.activity-grid{grid-template-columns:1fr}.setup-panel,.main-panel{min-height:0}.tab-content{max-height:none}.step-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (max-width:760px){.app-shell{width:min(100% - 16px,1520px);padding-top:8px}.panel{border-radius:18px;padding:14px}.write-card,.grid.two,.grid.three,.dump-map-toolbar,.map-entry,.map-footer,.slider-grid{grid-template-columns:1fr}.step-grid{grid-template-columns:repeat(2,minmax(0,1fr))}h1{font-size:2.4rem}.big-red{font-size:1.08rem}}@media (max-width:460px){.step-grid{grid-template-columns:1fr}.tabbar,.manual-recipe-actions,.tabbar button,.secondary,.segmented button{width:100%}h1{font-size:2rem}}