:root{--grubtech-100: #dbeafa;--grubtech-200: #bed9f5;--grubtech-300: #91c0ec;--grubtech-400: #5da0de;--grubtech-500: #3988d0;--grubtech-600: #2b7ebc;--grubtech-700: #245f93;--grubtech-900: #1b4366;--grubtech-950: #122b44;--bg0: #070f1c;--bg1: #0c1930;--ink: #e9f1f9;--muted: #8ba1b8;--faint: #5c7086;--line: rgba(148, 184, 220, .14);--line-strong: rgba(148, 184, 220, .28);--glass: rgba(20, 40, 66, .5);--glass-2: rgba(28, 52, 84, .55);--glow: rgba(57, 136, 208, .35);--danger: #ff7d6b;--ok: #4fd095;--font-body: "Inter", system-ui, -apple-system, sans-serif;--font-display: "Bricolage Grotesque", "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box;margin:0;padding:0}html{color-scheme:dark}body{font-family:var(--font-body);font-size:15px;line-height:1.55;color:var(--ink);background:radial-gradient(1100px 500px at 85% -10%,rgba(43,126,188,.22),transparent 60%),radial-gradient(900px 600px at -10% 110%,rgba(18,43,68,.9),transparent 65%),linear-gradient(170deg,var(--bg1) 0%,var(--bg0) 55%);min-height:100vh;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background-image:radial-gradient(rgba(139,161,184,.1) 1px,transparent 1.4px);background-size:28px 28px;mask-image:linear-gradient(180deg,rgba(0,0,0,.8),rgba(0,0,0,.25) 60%,transparent);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.8),rgba(0,0,0,.25) 60%,transparent)}.gd-header{position:sticky;top:0;z-index:50;height:3.75rem;display:flex;align-items:center;gap:.85rem;padding:0 1.75rem;border-bottom:1px solid var(--line);background:#070f1c99;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.gd-header .logo{height:22px;display:block}.gd-header .app-name{font-family:var(--font-display);font-weight:600;font-size:1.05rem;letter-spacing:.01em;color:var(--grubtech-300);border-left:1px solid var(--line-strong);padding-left:.85rem}.gd-main{max-width:80rem;margin:0 auto;padding:2.75rem 1.75rem 4rem;position:relative;z-index:1}.gd-main.wide{max-width:100rem}.gd-h1{font-family:var(--font-display);font-size:2rem;font-weight:700;letter-spacing:-.015em;background:linear-gradient(95deg,#f2f7fc 30%,var(--grubtech-300) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.gd-sub{color:var(--muted);font-size:.875rem;margin-top:.3rem}.gd-sub a{color:var(--grubtech-400);text-decoration:none}.gd-sub a:hover{text-decoration:underline}.page-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.75rem;gap:1rem}.btn-primary{display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(140deg,var(--grubtech-500),var(--grubtech-600));color:#fff;border:1px solid rgba(145,192,236,.35);border-radius:.6rem;padding:.55rem 1.1rem;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;box-shadow:0 4px 18px #2b7ebc59,inset 0 1px #ffffff2e;transition:transform .15s,box-shadow .15s,filter .15s}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 26px #2b7ebc80,inset 0 1px #ffffff2e;filter:brightness(1.06)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.45;cursor:default}.btn-secondary{display:inline-flex;align-items:center;gap:.4rem;background:#91c0ec14;color:var(--grubtech-200);border:1px solid var(--line-strong);border-radius:.6rem;padding:.55rem 1.05rem;font-size:13px;font-weight:500;font-family:inherit;cursor:pointer;transition:background-color .15s,border-color .15s,transform .15s}.btn-secondary:hover:not(:disabled){background:#91c0ec29;border-color:#91c0ec73;transform:translateY(-1px)}.btn-secondary:disabled{opacity:.45;cursor:default}.btn-secondary.sm,.btn-primary.sm{padding:.32rem .65rem;font-size:12px}.cards-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}.card{position:relative;border:1px solid var(--line);background:linear-gradient(165deg,var(--glass-2),var(--glass));border-radius:1rem;padding:1.4rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden;transition:border-color .18s,transform .18s,box-shadow .18s}.card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(420px 140px at 20% 0%,rgba(93,160,222,.16),transparent 70%);opacity:0;transition:opacity .2s}.card:hover{border-color:var(--line-strong);transform:translateY(-3px);box-shadow:0 18px 40px #030a1480,0 0 0 1px var(--glow)}.card:hover:after{opacity:1}.card-link{text-decoration:none;color:inherit;display:block}.card-title{margin:.6rem 0 .2rem;font-family:var(--font-display);font-size:1.12rem;font-weight:600;letter-spacing:-.01em}.badge{border-radius:999px;padding:.14rem .6rem;font-size:.72rem;font-weight:600;letter-spacing:.02em;border:1px solid transparent}.badge-draft{background:#8ba1b81f;color:var(--muted);border-color:#8ba1b840}.badge-ready{background:#3988d029;color:var(--grubtech-300);border-color:#3988d066}.badge-published{background:#4fd09521;color:var(--ok);border-color:#4fd09559}.badge-generating{background:#e8b44c24;color:#eec06a;border-color:#e8b44c59}.empty-state{border:1.5px dashed var(--line-strong);border-radius:1rem;padding:4.5rem 2rem;text-align:center;color:var(--muted);background:#0c193059}.empty-state h2{font-family:var(--font-display);font-size:1.25rem;font-weight:600;color:var(--ink);margin-bottom:.4rem}.empty-state p{font-size:.9rem;margin-bottom:1.4rem}.empty-state.slim{padding:2.2rem 1.5rem}.empty-state.slim p{margin:0}.callout{border-radius:.8rem;padding:.9rem 1.1rem;border:1px solid;margin:1rem 0;font-size:.875rem;cursor:pointer}.callout.danger{background:#ff7d6b1a;border-color:#ff7d6b66;color:var(--danger)}.gen-banner{display:flex;align-items:center;gap:.65rem;background:#3988d01a;border:1px solid rgba(57,136,208,.35);color:var(--grubtech-200);border-radius:.8rem;padding:.8rem 1.1rem;font-size:.875rem;margin-bottom:1rem;animation:bannerIn .35s ease both}@keyframes bannerIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#040912b3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center}.modal-card{background:linear-gradient(170deg,#12253e,#0c1930);border:1px solid var(--line-strong);border-radius:1rem;padding:1.75rem;width:min(28rem,calc(100vw - 2rem));box-shadow:0 30px 70px #0009,0 0 60px var(--glow);animation:modalIn .28s cubic-bezier(.22,1,.36,1) both}@keyframes modalIn{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}.modal-title{font-family:var(--font-display);font-size:1.2rem;font-weight:600;margin-bottom:1rem}.modal-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.4rem}.form-label{display:block;font-size:.78rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);margin:.9rem 0 .35rem}.form-input{width:100%;border-radius:.6rem;border:1px solid var(--line-strong);background:#070f1c99;color:var(--ink);padding:.65rem .95rem;font-size:.9rem;font-family:inherit;transition:border-color .15s,box-shadow .15s}.form-input::placeholder{color:var(--faint)}.form-input:focus{outline:none;border-color:var(--grubtech-500);box-shadow:0 0 0 3px #3988d040}.form-input.mono{font-family:var(--font-mono);font-size:.83rem}.panel{border:1px solid var(--line);background:linear-gradient(170deg,#12253e8c,#0a15268c);border-radius:1rem;padding:1.4rem;margin-bottom:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.1rem;gap:1rem}.panel-title{font-family:var(--font-display);font-size:1.1rem;font-weight:600;letter-spacing:-.01em}.shots-row{display:flex;gap:1rem;overflow-x:auto;padding:.25rem .25rem .6rem}.shot-card{flex:none;width:132px;border:1px solid var(--line);border-radius:.9rem;overflow:hidden;background:#070f1c80;transition:border-color .18s,transform .18s,box-shadow .18s}.shot-card:hover{transform:translateY(-2px);border-color:var(--line-strong)}.shot-card.generating{border-color:var(--grubtech-500);animation:genGlow 1.6s ease infinite}@keyframes genGlow{0%,to{box-shadow:0 0 0 2px #3988d059,0 0 18px #3988d033}50%{box-shadow:0 0 0 2px #3988d099,0 0 34px #3988d066}}.shot-card.error{border-color:#ff7d6b99}.shot-card img{width:100%;height:200px;object-fit:cover;object-position:top;display:block;background:#0e1c30}.shot-meta{padding:.55rem}.shot-name{display:block;font-size:.68rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.45rem;font-family:var(--font-mono)}.shot-actions{display:flex;gap:.35rem}.spinner{width:13px;height:13px;border-radius:50%;border:2px solid rgba(145,192,236,.3);border-top-color:var(--grubtech-400);animation:spin .7s linear infinite;display:inline-block;flex:none}@keyframes spin{to{transform:rotate(360deg)}}.editor-grid{display:grid;grid-template-columns:210px 1fr 380px;gap:1.1rem;align-items:start}.screen-list{border:1px solid var(--line);border-radius:.8rem;overflow:hidden;background:#070f1c73}.screen-item{display:flex;align-items:center;border-bottom:1px solid var(--line)}.screen-item:last-of-type{border-bottom:none}.screen-item.active{background:#3988d024;box-shadow:inset 3px 0 0 var(--grubtech-500)}.screen-name{flex:1;text-align:left;background:none;border:none;padding:.65rem .8rem;font-family:var(--font-mono);font-size:.76rem;cursor:pointer;color:var(--muted)}.screen-item.active .screen-name{color:var(--grubtech-200);font-weight:600}.screen-tools{display:flex;gap:.05rem;padding-right:.4rem;opacity:0;transition:opacity .15s}.screen-item:hover .screen-tools{opacity:1}.screen-tools button{background:none;border:none;cursor:pointer;color:var(--faint);font-size:.75rem;padding:.15rem .28rem}.screen-tools button:hover{color:var(--grubtech-300)}.screen-list .gd-sub{border-top:1px solid var(--line)}.pill-tabs{display:flex;gap:.3rem;background:#070f1c99;border:1px solid var(--line);padding:.28rem;border-radius:.7rem;width:fit-content;margin-bottom:.8rem}.pill-tabs button{border:none;background:none;color:var(--muted);border-radius:.45rem;padding:.42rem 1rem;font-size:13px;font-family:inherit;cursor:pointer;transition:color .15s,background-color .15s}.pill-tabs button:hover{color:var(--ink)}.pill-tabs button.active{background:linear-gradient(140deg,var(--grubtech-500),var(--grubtech-600));color:#fff;font-weight:600}.tour-fields{display:grid;grid-template-columns:1fr 2fr;gap:.5rem;margin-bottom:.8rem}.tour-fields .form-input{padding:.45rem .8rem;font-size:.82rem;border-radius:.5rem}.editor-main{min-width:0}.editor-main .cm-editor{border:1px solid var(--line);border-radius:.8rem;overflow:hidden;font-size:12.5px;background:#0a1424}.editor-main .cm-editor.cm-focused{outline:none;border-color:var(--line-strong);box-shadow:0 0 0 3px #3988d026}.editor-preview{position:sticky;top:4.6rem}.editor-preview iframe{width:100%;aspect-ratio:393 / 730;border:1px solid var(--line);border-radius:1rem;background:#0a1622;box-shadow:0 24px 60px #02081299}code{font-family:var(--font-mono);font-size:.83em;background:#91c0ec1f;color:var(--grubtech-200);padding:.1em .4em;border-radius:4px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#8ba1b840;border-radius:999px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background-color:#8ba1b873}::-webkit-scrollbar-track{background:transparent}.shot-card.desktop{width:280px}.shot-card.desktop img{height:165px}.editor-grid.desktop{grid-template-columns:200px 1fr}.editor-grid.desktop .editor-preview{grid-column:1 / -1;position:static;max-width:1100px}.editor-grid.desktop .editor-preview iframe{box-shadow:0 18px 44px #02081280}.pill-tabs button{display:inline-flex;align-items:center;gap:.4rem}.screen-tools button{display:inline-flex;align-items:center}.screen-name{display:inline-flex;align-items:center;gap:.35rem}.start-star{color:#eec06a;fill:#eec06a;flex:none}.meta-chip{display:inline-flex;align-items:center;gap:.3rem;color:var(--grubtech-300);font-weight:500}.spin-icon{animation:spin .9s linear infinite}