:root{--font: system-ui, sans-serif;--ink: #1c1917;--paper: #f7f4ef;--bar: #2f2b3d;--bar-ink: #f5f5f7;--line: #d6d3d1;--accent: #6d28d9;--error: #b91c1c;--card: #fff;--muted: #57534e;--highlight: #d4c4f7;--target: #a78bfa;--menubar-height: 50px;--view-banner-height: 0px;--nav-height: 0px;--side-width: 280px}:root[data-theme=dark]{--ink: #f5f5f7;--paper: #1c1917;--line: #44403c;--card: #292524;--muted: #a8a29e;--highlight: #3b3158;--target: #7c3aed;--bar: #14121c;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:var(--font);color:var(--ink);background:var(--paper)}button,input{font:inherit}a{color:inherit}::selection{background:#c4b5fd;color:#1c1917}.app-layout{display:flex;flex-direction:column;min-height:100vh}.app-layout>app-menubar{display:block;width:100%;flex-shrink:0;position:sticky;top:0;z-index:100}.page-shell{position:relative;z-index:0;flex:1 0 auto;width:100%}.main-content-wrapper{width:100%;margin:16px auto 0;padding:0 16px 32px}.main-content{position:relative;z-index:1;width:min(880px,100%);margin-right:auto;margin-left:auto}.side-rail{position:fixed;z-index:20;top:calc(var(--view-banner-height) + var(--menubar-height) + var(--nav-height) + 8px);display:flex;align-items:flex-start;max-height:calc(100vh - var(--view-banner-height) - var(--menubar-height) - var(--nav-height) - 16px)}.side-rail-left{left:0}.side-rail-right{right:0}.side-rail .side-card{width:var(--side-width);max-height:calc(100vh - var(--view-banner-height) - var(--menubar-height) - var(--nav-height) - 16px);overflow:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent;transition:width .2s ease,opacity .2s ease,padding .2s ease}.side-rail-right .side-card::-webkit-scrollbar,.side-rail-left .side-card::-webkit-scrollbar{width:4px}.side-rail-right .side-card::-webkit-scrollbar-thumb,.side-rail-left .side-card::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}.side-rail-right .side-card::-webkit-scrollbar-track,.side-rail-left .side-card::-webkit-scrollbar-track{background:transparent}.side-rail.is-collapsed .side-card{width:0;padding:0;border-width:0;opacity:0;overflow:hidden}.side-tab{flex:0 0 32px;width:32px;min-height:132px;margin:0;padding:10px 0;border:1px solid var(--line);background:var(--card);color:inherit;writing-mode:vertical-rl;cursor:pointer;font:inherit;font-weight:700}.side-tab.is-open{display:flex;align-items:center;justify-content:center;min-height:56px;writing-mode:horizontal-tb}.side-tab-arrow{display:block;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor}.side-rail-left .side-tab-arrow{transform:rotate(135deg)}.side-rail-right .side-tab-arrow{transform:rotate(-45deg)}.side-card{border:1px solid var(--line);background:var(--card);padding:12px}.side-card h2,.main-content h2,.side-card h3{margin:16px 0 8px;font-size:1rem}.side-card h2,.main-content h1{margin-top:0}.main-content h1{margin-bottom:8px;font-size:1.4rem}.main-content p,.side-card p,.plain-list,.check-list,.stat-list{margin:0 0 8px;line-height:1.4}.action-list{display:flex;flex-direction:column;gap:8px;margin:16px 0}.action-link{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line);background:var(--card);text-decoration:none;font-weight:700}.action-link span,.muted{font-weight:400;color:var(--muted);font-size:.85rem}.stat-list,.check-list,.plain-list{padding:0}.stat-list,.check-list{list-style:none}.stat-list li,.check-list li{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px solid var(--line)}.check-list li{align-items:flex-start}.achievement-name{display:flex;align-items:flex-start;gap:10px}.achievement-icon{width:1.5rem;font-size:1.25rem;line-height:1.3;text-align:center}.achievement-title,.achievement-action{display:block}.achievement-title{font-weight:700}.milestone-list li{flex-direction:column;align-items:stretch}.milestone-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;width:100%}.milestone-list .level-bar{width:100%;margin:6px 0 0}.brand-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center}.brand-mark{width:72px;height:100px;margin-bottom:20px;border:3px solid var(--bar);border-radius:8px;background:linear-gradient(var(--accent),var(--accent)) center 16px/36px 8px no-repeat,var(--paper);box-shadow:6px 6px 0 var(--bar)}:root[data-theme=dark] .brand-mark{border-color:#d6d3d1;box-shadow:6px 6px #a8a29e}.topbar-badge{position:absolute;top:2px;right:0;min-width:1rem;padding:0 4px;border-radius:999px;background:var(--accent);color:#fff;font-size:.65rem;line-height:1rem}.topbar-filter{width:calc(100% - 24px);margin:8px 12px;padding:6px 8px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}.topbar-row.is-unread,.inbox-row.is-unread{background:var(--highlight);color:var(--ink)}.topbar-row.is-target,.inbox-row.is-target,.check-list li.is-target,.settings-block.is-target{background:var(--target);color:#1c1917;border-radius:4px;padding-left:8px;padding-right:8px}:root[data-theme=dark] .topbar-row.is-target,:root[data-theme=dark] .inbox-row.is-target,:root[data-theme=dark] .check-list li.is-target,:root[data-theme=dark] .settings-block.is-target{color:#f5f5f7}.topbar-type{width:1.4rem;font-size:1rem;line-height:1.2}.topbar-mark{display:flex;align-items:center;margin-left:auto;padding:0 4px;border:0;background:none;color:var(--accent);cursor:pointer}.topbar-mark-dot{display:block;width:8px;height:8px;border-radius:50%;background:currentColor}:root[data-theme=dark] .topbar-mark,:root[data-theme=dark] .topbar-more{color:#c4b5fd}.topbar-more{display:block;width:100%;padding:10px 12px;border:0;border-top:1px solid var(--line);background:none;color:var(--accent);font:inherit;font-weight:700;text-align:start;text-decoration:none;cursor:pointer}.task-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin:16px 0}.task-panel{position:relative;z-index:1;display:flex;flex-direction:column;gap:8px;min-height:96px;padding:16px;border:1px solid var(--line);background:var(--card);color:inherit;text-decoration:none;cursor:pointer}.settings-block{margin:0 0 22px}.settings-block h2{margin-bottom:4px}.settings-button{width:auto;padding:6px 12px;border:1px solid var(--line);background:var(--card);color:inherit;cursor:pointer}.choice-row{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.choice-row button{padding:6px 12px;border:1px solid var(--line);background:var(--card);color:inherit;cursor:pointer}.choice-row button.is-selected{border-color:var(--accent);font-weight:700}.task-panel-count{font-size:1.75rem;font-weight:700}.task-panel-name{font-weight:700}.dashboard-field{display:flex;flex-direction:column;gap:4px;max-width:320px;margin:0 0 12px}.dashboard-field input,.dashboard-field select{padding:6px 8px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}.inbox-row button{margin-left:auto;padding:0;border:0;background:none;color:var(--accent);cursor:pointer}.tutorial-layer{position:fixed;inset:0;z-index:80;pointer-events:none}.tutorial-ring{position:fixed;pointer-events:none;border:2px solid var(--accent);border-radius:8px;box-shadow:0 0 0 9999px #1c19178c}.tutorial-card{position:fixed;width:min(300px,100vw - 24px);padding:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);pointer-events:auto;box-shadow:0 8px 24px #1c191729}.tutorial-card p{margin:0 0 12px}.tutorial-actions{display:flex;justify-content:flex-end;gap:8px}.tutorial-actions button{cursor:pointer}.profile-tabs{display:flex;gap:16px;margin:0 0 16px}.inbox-tabs{gap:12px;font-size:.9rem}.inbox-actions{align-items:center;margin:0 0 8px}.inbox-actions button:disabled{opacity:.45;cursor:default}.inbox-row input{margin-top:4px}.inbox-row>a{flex:1;color:inherit;text-decoration:none}.profile-tabs a{color:inherit;font-weight:700;text-decoration:none}.profile-tabs a.is-current{border-bottom:2px solid var(--accent)}.inbox-row{display:flex;gap:8px;padding:10px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}.inbox-row .achievement-title,.inbox-row .muted{display:block}.brand-page h1{margin:0;font-size:2rem;letter-spacing:.04em}.medal{display:inline-block;width:.7rem;height:.7rem;margin-right:6px;border-radius:50%;background:#b87333;vertical-align:middle}.medal-gold{background:#d4a017}.medal-platinum{background:#e5e4e2;box-shadow:inset 0 0 0 1px #8e8e93}.medal-diamond{background:#7dd3fc;box-shadow:inset 0 0 0 1px #0284c7}.milestone-toasts{position:fixed;top:calc(var(--view-banner-height) + var(--menubar-height) + 12px);right:16px;z-index:60;display:flex;flex-direction:column;gap:8px;width:min(320px,100vw - 32px)}.milestone-toast{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border:1px solid var(--line);background:var(--card);color:inherit;text-align:start;cursor:pointer;box-shadow:0 8px 24px #1c19171f}.confetti{position:fixed;inset:0;z-index:70;width:100%;height:100%;pointer-events:none}.celebrate-backdrop{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:16px;background:#1c191773}.celebrate-card{width:min(420px,100%);padding:20px;border:1px solid var(--line);background:var(--paper)}.celebrate-card h2{margin:0 0 8px}.celebrate-card .auth-button{margin-top:12px}.score-table{width:100%;border-collapse:collapse}.score-table th,.score-table td{padding:8px 6px;border-bottom:1px solid var(--line);text-align:start}.score-table th:not(:first-child),.score-table td:not(:first-child){text-align:end}.score-table .is-you td{font-weight:700}.plain-list{padding-left:1.2rem}.plain-list li{margin:0 0 6px}.home-login{max-width:200px}.lens-video{display:block;width:100%;margin:0 0 12px;background:#111;touch-action:none}.lens-video[hidden]{display:none}.situation-picks{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}.situation-picks button{padding:6px 8px;border:1px solid var(--line);background:var(--card);cursor:pointer}.situation-picks button.is-selected{border-color:var(--accent);font-weight:700}.review-frame{position:relative;width:100%;margin:0 0 12px}.review-image{display:block;width:100%;height:auto}.review-marks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.mark-examples{display:flex;flex-wrap:wrap;gap:16px;margin:12px 0}.mark-examples figure{margin:0;max-width:220px}.mark-example{display:block;width:100%;height:auto;background:var(--card);border:1px solid var(--line)}.mark-examples figcaption{margin-top:4px;font-size:.85rem}.mark-viewport{position:relative;width:100%;height:70vh;overflow:hidden;background:#111;touch-action:none}.mark-stage{position:absolute;top:0;left:0;transform-origin:0 0}.mark-stage img{display:block;width:100%;height:100%}.mark-stage svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.button-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.button-row .auth-button{width:auto}.photo-list{display:flex;flex-direction:column;gap:8px}.photo-row{display:flex;align-items:flex-start;gap:12px;padding:8px;border:1px solid var(--line);background:var(--card)}.photo-row img{width:120px;height:auto}.photo-row span{display:flex;flex-direction:column;gap:4px}.photo-open{display:flex;align-items:flex-start;gap:12px;flex:1;padding:0;border:0;background:none;color:inherit;cursor:pointer;text-align:start}.photo-detail{margin:0 0 16px}.stats-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin:0 0 20px}.stats-identity{display:flex;flex-direction:column;gap:4px;min-width:0}.stats-email{font-size:1.1rem;font-weight:600;word-break:break-all}.stats-username{color:var(--muted);font-size:.95rem}.xp-badge{flex-shrink:0;min-width:180px;padding:12px 16px;border:1.5px solid var(--accent);border-radius:12px;background:var(--card);text-align:end}.xp-points{color:var(--accent);font-size:1.1rem;font-weight:600}.xp-level{margin:2px 0 8px;font-size:.95rem}.xp-badge .level-bar{margin:0}:root[data-theme=dark] .xp-badge{border-color:#c4b5fd}:root[data-theme=dark] .xp-points{color:#c4b5fd}.level-bar{height:6px;margin:0 0 8px;background:var(--line)}.level-bar span{display:block;height:100%;background:var(--accent)}.checklist-situations li{flex-direction:column;align-items:stretch}.checklist-goal{display:flex;flex-wrap:wrap;align-items:center;gap:8px;width:100%}.checklist-goal .level-bar{flex:1 1 100%;margin:0}.is-done{text-decoration:line-through}@media screen and (max-width: 900px){.main-content-wrapper{flex-direction:column}.main-content{order:1;max-width:none}}.auth-panel{display:flex;flex-direction:column;gap:10px;width:min(400px,100%);padding:8px 20px 20px;background:var(--card)}.auth-label{font-weight:700}.auth-input,.auth-button,.auth-link{font:inherit}.auth-input{width:100%;padding:8px 10px;border:1px solid var(--line);background:var(--card);color:var(--ink)}.auth-button{width:100%;padding:10px 12px;border:0;background:var(--accent);color:#fff;cursor:pointer}.auth-button.is-waiting{opacity:.7;pointer-events:none}.auth-error{min-height:1.2em;text-align:end;color:var(--error);font-size:.9rem}.auth-error.hidden{visibility:hidden}.auth-links{display:flex;justify-content:space-between;gap:12px}.auth-link{padding:0;border:0;background:none;color:var(--accent);cursor:pointer}.hover-overlay{position:fixed;inset:0;z-index:40;background:#00000073}.hover-container{display:flex;min-height:100%;align-items:flex-start;justify-content:center;padding:48px 16px}.hover-content{background:var(--card);border:1px solid var(--line)}.auth-close{display:flex;justify-content:flex-end}.close-button{padding:8px 12px;cursor:pointer;font-size:1.4rem;line-height:1}.registrationLoginHeader{margin:0 20px 8px;font-size:1.4rem}.auth-closed{margin:28px 0 12px;text-align:center;font-size:1.6rem;font-weight:700}
