.app-shell{--app-shell-header-h:var(--topbar-h);--app-shell-tabbar-h:60px;min-height:100dvh;color:var(--text-body);font-family:var(--font-sans);background:var(--surface-page);flex-direction:column;display:flex}.app-shell-body{flex-direction:column;flex:auto;min-width:0;display:flex;position:relative}.app-shell-main{min-width:0;min-height:0;animation:lodnor-screen-in var(--dur-screen) ease-out;flex-direction:column;flex:auto;display:flex}.app-shell-main:focus{outline:none}.app-shell-main>.lodnor-sheet{width:100%;min-width:0;box-shadow:none;flex:auto}.app-shell-header{z-index:30;flex:0 0 var(--app-shell-header-h);align-items:center;gap:var(--space-4);height:var(--app-shell-header-h);background:var(--surface-page);border-bottom:var(--stroke-hair) solid var(--line-hair);padding:0 clamp(16px,3vw,32px);display:flex;position:sticky;top:0}.app-shell-mark{width:var(--touch-min);height:var(--touch-min);color:var(--text-display);border-radius:var(--radius-1);transition:background-color var(--dur-fast) var(--ease-standard);flex:none;justify-content:center;align-items:center;margin-left:-6px;display:flex}.app-shell-mark .lodnor-brand-mark{width:32px;height:32px}.app-shell-mark:hover{background:var(--action-quiet-hover)}.app-shell-nav{gap:var(--space-2);margin-left:var(--space-7);display:flex}.app-shell-nav-link{align-items:center;gap:var(--space-4);height:var(--space-10);padding:0 var(--space-6);color:var(--text-secondary);font:var(--weight-medium) var(--size-15) / 1 var(--font-sans);border-radius:var(--radius-full);transition:background-color var(--dur-base) var(--ease-standard), color var(--dur-base) var(--ease-standard);text-decoration:none;display:flex;position:relative}.app-shell-nav-link:before{content:"";position:absolute;inset:-2px 0}.app-shell-nav-link:hover{color:var(--text-display);background:var(--action-quiet-hover)}.app-shell-nav-link[data-current=true]{color:var(--text-display);background:var(--surface-sunk)}.app-shell-badge{box-sizing:border-box;min-width:18px;height:18px;color:var(--text-on-accent);font:var(--weight-semibold) 11px / 18px var(--font-sans);font-variant-numeric:var(--numeric);text-align:center;background:var(--action-accent);border-radius:var(--radius-full);padding:0 5px}.app-shell-spacer{flex:1}.app-shell-new{flex:none}.app-shell-account{min-width:var(--touch-min);height:var(--touch-min);justify-content:center;align-items:center;gap:var(--space-3);margin-left:var(--space-4);border-radius:var(--radius-full);cursor:pointer;background:0 0;border:0;flex:none;padding:0;display:flex}.app-shell-account:hover .lodnor-avatar,.app-shell-account[aria-expanded=true] .lodnor-avatar{background:var(--action-quiet-press)}.app-shell-mark:focus-visible,.app-shell-nav-link:focus-visible,.app-shell-account:focus-visible,.app-shell-gauge:focus-visible,.app-shell-tab:focus-visible,.app-shell-tabbar-job:focus-visible,.app-shell-phonebar-back:focus-visible{outline:var(--ring-focus-outline);outline-offset:var(--ring-focus-offset)}.app-shell-gauge-tooltip{flex:none}.app-shell-gauge{align-items:center;gap:var(--space-4);height:var(--control-h-sm);padding:0 var(--space-5);color:var(--text-secondary);font:var(--weight-medium) var(--size-13) / 1 var(--font-sans);border:var(--stroke-thin) solid var(--line-hair);border-radius:var(--radius-full);transition:background-color var(--dur-fast) var(--ease-standard);text-decoration:none;display:inline-flex}.app-shell-gauge:hover{color:var(--text-display);background:var(--action-quiet-hover)}.app-shell-gauge-dot{background:var(--line-measure);border-radius:var(--radius-full);width:6px;height:6px;animation:lodnor-breathe var(--dur-breathe) ease-in-out infinite;flex:none}.app-shell-gauge-pct{color:var(--text-measure);font-variant-numeric:var(--numeric)}.app-shell-gauge-track{background:var(--line-hair);border-radius:var(--radius-full);width:36px;height:2px;display:block}.app-shell-gauge-track:after{content:"";width:var(--job,0%);background:var(--line-measure);border-radius:inherit;max-width:100%;height:100%;display:block}.app-shell-tabbar,.app-shell-phonebar{display:none}@media (max-width:720px){.app-shell{--lodnor-toast-inset-bottom:calc(var(--app-shell-tabbar-h) + 28px)}.app-shell-header{display:none}.app-shell[data-chrome=app]:not([data-presentation=editor]) .app-shell-body{padding-bottom:calc(var(--app-shell-tabbar-h) + var(--space-4) + env(safe-area-inset-bottom,0px))}.app-shell-tabbar{z-index:30;padding:var(--space-2) var(--space-4) calc(var(--space-2) + env(safe-area-inset-bottom,0px));background:var(--surface-stock);border-top:var(--stroke-thin) solid var(--line-rule);display:block;position:fixed;inset:auto 0 0}.app-shell-tabs{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.app-shell-tab{justify-content:center;align-items:center;gap:var(--space-2);min-height:52px;color:var(--text-secondary);font:var(--weight-medium) var(--size-12) / 15px var(--font-sans);border-radius:var(--radius-1);cursor:pointer;background:0 0;border:0;flex-direction:column;padding:0;text-decoration:none;display:flex;position:relative}.app-shell-tab[data-current=true]{color:var(--text-display);background:var(--surface-sunk)}.app-shell-tab[data-current=true]>svg{color:var(--text-accent)}.app-shell-tab .app-shell-badge{top:var(--space-2);min-width:16px;height:16px;padding:0 4px;font-size:10px;line-height:16px;position:absolute;right:calc(50% - 20px)}.app-shell-tabbar-job{align-items:center;gap:var(--space-4);min-height:var(--control-h-sm);margin:0 var(--space-2) var(--space-2);padding:0 var(--space-5);color:var(--text-secondary);font:var(--weight-medium) var(--size-13) / 1.2 var(--font-sans);border-radius:var(--radius-1);text-decoration:none;display:flex;position:relative;overflow:hidden}.app-shell-tabbar-job:after{content:"";width:var(--job,0%);background:var(--line-measure);height:2px;position:absolute;inset:auto auto 0 0}.app-shell-tabbar-job-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.app-shell[data-presentation=editor] .app-shell-phonebar{align-items:center;gap:var(--space-2);padding:0 var(--space-3);background:var(--surface-page);border-bottom:var(--stroke-hair) solid var(--line-hair);flex:0 0 56px;display:flex}.app-shell-phonebar-back{width:var(--touch-min);height:var(--touch-min);color:var(--text-display);border-radius:var(--radius-full);justify-content:center;align-items:center;display:flex}.app-shell-phonebar-title{min-width:0;color:var(--text-display);font:var(--weight-semibold) var(--size-17) / 1.2 var(--font-sans);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.app-shell[data-presentation=editor]{--lodnor-toast-inset-bottom:var(--space-6)}}.app-shell[data-presentation=editor]{height:100dvh;overflow:hidden}.app-shell[data-presentation=editor] .app-shell-header{position:relative}.app-shell[data-presentation=editor] .app-shell-body{flex:1 1 0;min-height:0}.app-shell[data-presentation=editor] .app-shell-main{animation:none}.lt-app{background:var(--surface-stock);flex-direction:column;min-height:100dvh;display:flex}.lt-page{flex-direction:column;flex:auto;min-width:0;min-height:0;display:flex}.lt-page>.lodnor-sheet{width:100%;min-width:0;box-shadow:none;flex:auto}.lt-mark{text-indent:0;width:fit-content;max-width:100%;color:var(--text-display);line-height:0;text-decoration:none;display:inline-flex}.lodnor-state.workspace-state{width:min(720px,100%);min-height:0;box-shadow:none;background:0 0;border:0;flex:none;align-self:flex-start;gap:16px;padding:clamp(32px,6vw,80px) clamp(20px,4vw,56px)}.workspace-state-label{color:var(--text-display);font:500 18px / 1.4 var(--font-sans);margin:0}.workspace-state-icon{color:var(--text-secondary)}.workspace-state .lodnor-heading-2{letter-spacing:-.035em;max-width:22ch;font-size:clamp(26px,3vw,36px);font-weight:550}.workspace-state .lodnor-lead{overflow-wrap:anywhere;margin:0;font-size:16px}.workspace-state .lodnor-state-actions{margin-top:8px}@media (max-width:720px){.app-shell .workspace-state{padding:32px 20px}}.lt-error-reference{color:var(--text-secondary);overflow-wrap:anywhere;flex-basis:100%;font-size:14px;line-height:1.5}.app-shell-account-name{max-width:180px;color:var(--text-body);font:var(--weight-medium) var(--size-15) / normal var(--type-core);text-overflow:ellipsis;text-transform:none;white-space:nowrap;overflow:hidden}@media (max-width:600px){.app-shell-account-name{max-width:100px}}.builder-name-prompt{align-items:center;gap:var(--space-4);padding:var(--space-4);margin-bottom:var(--space-4);background:var(--surface-card);border:var(--border-hair);border-radius:var(--radius-2);flex-wrap:wrap;display:flex}.builder-name-prompt p{margin:0}.app-shell-account-tab{gap:var(--space-1);min-width:0}.app-shell-account-tab .app-shell-account-name{max-width:min(100px,100%);font:inherit}
.pocket-builder{--pocket-ink:#304333;--pocket-paper:#f3f0df;--pocket-accent:#a6442c;background:var(--pocket-paper);color:var(--pocket-ink);border:1px solid #c9ceb7;padding:clamp(16px,3vw,32px)}.pocket-heading,.pocket-bottom{justify-content:space-between;align-items:center;gap:12px;display:flex}.pocket-heading h2{font:550 clamp(26px, 3vw, 38px) / 1.1 var(--font-sans);letter-spacing:-.04em;margin:5px 0 0}.pocket-kicker,.pocket-intro,.pocket-instructions,.pocket-message,.pocket-footnote{font:400 13px / 1.5 var(--font-sans);margin:0}.pocket-kicker{color:var(--pocket-accent)}.pocket-intro{max-width:46ch;margin:14px 0 20px;font-size:15px}.pocket-toolbar{gap:8px;display:flex}.pocket-toolbar button{min-height:48px;color:var(--pocket-ink);font:500 13px / 1 var(--font-sans);cursor:pointer;background:#fbf9ef;border:1px solid #bbc3ad;border-radius:6px;flex:1;justify-content:center;align-items:center;gap:4px;padding:4px 8px;display:flex}.pocket-toolbar button[aria-pressed=true]{color:#fff9e9;background:#304333;border-color:#304333}.pocket-toolbar svg{width:30px;height:36px}.pocket-eraser{width:24px;font-size:28px}.pocket-instructions{margin-top:14px}.pocket-land{background:#dfe5cd;border-radius:12px;grid-template-columns:repeat(5,minmax(0,1fr));max-width:460px;margin:14px auto;padding:10px;display:grid}.pocket-plot{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:5px;min-width:0;min-height:44px;padding:0}.pocket-plot svg{width:100%;max-height:78px;transition:transform .15s;display:block}.pocket-plot:hover svg{transform:translateY(-3px)}.pocket-plot[data-piece=home] svg,.pocket-plot[data-piece=tree] svg,.pocket-plot[data-piece=pond] svg{animation:.18s ease-out pocket-place}.pocket-builder button:focus-visible{outline:3px solid var(--pocket-accent);outline-offset:3px}.pocket-message{align-items:center;min-height:40px;display:flex}.pocket-goals{border-top:1px solid #c9ceb7;grid-template-columns:1fr 1fr;gap:10px 16px;margin:12px 0 0;padding:14px 0 0;list-style:none;display:grid}.pocket-goals li{font:400 13px / 1.4 var(--font-sans);gap:8px;display:flex}.pocket-goals li[data-complete=true]{color:#315f3c;font-weight:650}.pocket-footnote{margin-top:18px;font-size:12px}.trace-play-status{border:1px solid var(--line-rule);background:var(--surface-sketch);grid-area:playstatus;padding:16px 20px}.trace-play-status p{margin:4px 0 0}.trace-sheet:has(.pocket-builder){grid-template-areas:"head head""playstatus playstatus""source status""stages status"}.trace-sheet:has(.pocket-builder) .trace-progress-value{font-size:24px}.trace-sheet:has(.pocket-builder) .trace-percent-unit{font-size:16px}.trace-source-disclosure{margin-top:20px}.trace-source-disclosure>summary{cursor:pointer;min-height:44px;font:500 14px / 1.4 var(--font-sans);padding:12px 0;display:list-item}@keyframes pocket-place{0%{transform:translateY(-6px)}to{transform:translateY(0)}}@media (max-width:899px){.trace-sheet:has(.pocket-builder){grid-template-areas:"head""playstatus""source""status""stages"}}@media (max-width:420px){.pocket-toolbar button{flex-direction:column;padding:6px 2px}.pocket-goals{grid-template-columns:1fr}.pocket-land{padding:2px}}@media (prefers-reduced-motion:reduce){.pocket-plot svg{transition:none;animation:none!important}.pocket-plot:hover svg{transform:none}}
