:root{color-scheme:light;--font-sans: system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;--text-xs: 11.5px;--text-sm: 12.5px;--text-md: 13.5px;--text-base: 14px;--text-lg: 15px;--text-xl: 19px;--text-2xl: 22px;--leading-tight: 1.3;--leading-normal: 1.55;--weight-normal: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--color-bg: #f7f7f5;--color-surface: #ffffff;--color-border: #e2e0dc;--color-text: #1f1e1c;--color-muted: #7a766f;--color-accent: #b3562e;--color-accent-strong: #7e3a1c;--color-accent-soft: rgba(179, 86, 46, .12);--color-accent-softer: rgba(179, 86, 46, .08);--color-on-accent: #ffffff;--color-danger: #a33830;--color-danger-soft: #fdf1f0;--color-danger-border: #eccfcc;--color-overlay: rgba(31, 30, 28, .45);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-9: 36px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 999px;--shadow-sm: 0 1px 3px rgba(31, 30, 28, .12);--shadow-md: 0 4px 14px rgba(31, 30, 28, .1);--shadow-lg: 0 18px 50px -18px rgba(31, 30, 28, .25), 0 2px 8px rgba(31, 30, 28, .05);--focus-ring: 0 0 0 3px var(--color-accent-soft);--focus-ring-danger: 0 0 0 3px rgba(163, 56, 48, .15);--transition-fast: .12s ease;--control-height: 34px;--control-height-lg: 42px;--touch-target: 44px}*{box-sizing:border-box}body{margin:0;font-family:var(--font-sans);font-size:var(--text-base);background:var(--color-bg);color:var(--color-text)}a{color:var(--color-accent)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;font-size:var(--text-md);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:var(--control-height);padding:0 var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);cursor:pointer;white-space:nowrap;transition:border-color var(--transition-fast),color var(--transition-fast),background var(--transition-fast),opacity var(--transition-fast)}.btn:hover{border-color:var(--color-accent);color:var(--color-accent)}.btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}.btn:disabled{opacity:.55;cursor:default;pointer-events:none}.btn--primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent);font-weight:var(--weight-semibold)}.btn--primary:hover{background:var(--color-accent-strong);border-color:var(--color-accent-strong);color:var(--color-on-accent)}.btn--danger{color:var(--color-danger)}.btn--danger:hover{border-color:var(--color-danger);color:var(--color-danger);background:var(--color-danger-soft)}.btn--danger:focus-visible{box-shadow:var(--focus-ring-danger)}.btn--sm{height:26px;padding:0 var(--space-2);font-size:var(--text-sm)}.btn--lg{height:var(--control-height-lg);padding:0 var(--space-4);border-radius:var(--radius-md)}.btn--block{width:100%}.btn--bare{border:0;background:transparent;height:auto;padding:var(--space-1);color:var(--color-muted)}.btn--bare:hover{color:var(--color-accent);background:transparent}.input,.textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;font-size:var(--text-md);width:100%;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);background:var(--color-surface);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input:focus,.textarea:focus{outline:none;border-color:var(--color-accent);box-shadow:var(--focus-ring)}.input--invalid{border-color:var(--color-danger)}.input--invalid:focus{box-shadow:var(--focus-ring-danger)}.input:-webkit-autofill,.input:-webkit-autofill:hover,.input:-webkit-autofill:focus{-webkit-text-fill-color:var(--color-text);box-shadow:0 0 0 1000px var(--color-surface) inset;transition:background-color 999999s ease-in-out 0s}.field{display:flex;flex-direction:column;gap:var(--space-1)}.field__label{font-size:var(--text-md);font-weight:var(--weight-semibold)}.field__hint{font-size:var(--text-sm);color:var(--color-muted)}.field__error{font-size:var(--text-sm);color:var(--color-danger)}.password-wrap{position:relative}.password-wrap .input{padding-right:42px}.password-wrap .btn--bare{position:absolute;right:var(--space-1);top:50%;transform:translateY(-50%)}.alert{font-size:var(--text-md);color:var(--color-danger);background:var(--color-danger-soft);border:1px solid var(--color-danger-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3)}.status-chip{font-size:var(--text-sm);color:var(--color-muted)}.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:var(--color-on-accent);border-radius:var(--radius-full);animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);display:grid;place-items:center;padding:var(--space-4);z-index:100}.dialog{width:min(420px,100%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:var(--space-5) var(--space-6)}.dialog__title{margin:0 0 var(--space-2);font-size:var(--text-lg);font-weight:var(--weight-semibold)}.dialog__body{font-size:var(--text-md);color:var(--color-muted);line-height:var(--leading-normal);display:grid;gap:var(--space-3)}.dialog__body .field__label{color:var(--color-text)}.dialog__actions{display:flex;gap:var(--space-2);justify-content:flex-end;margin-top:var(--space-5)}.share-url-row{display:flex;gap:var(--space-2)}.share-url-row .input{font-family:var(--font-mono);font-size:var(--text-sm)}.brand{display:flex;align-items:baseline;gap:var(--space-2);flex-wrap:wrap;margin:0}.brand-sub{font-size:.62em;font-weight:var(--weight-medium);opacity:.72;letter-spacing:.01em;white-space:nowrap}.brand-sub a{color:inherit}.brand-logo{width:48px;height:48px;border-radius:var(--radius-lg);display:grid;place-items:center;background:#ffffff29}.empty-state{margin:auto;color:var(--color-muted);text-align:center;padding:var(--space-8)}.app{display:grid;grid-template-columns:260px 1fr 1fr;height:100vh;height:100dvh}.mobile-nav{display:none}.sidebar{border-right:1px solid var(--color-border);background:var(--color-surface);display:flex;flex-direction:column;overflow:hidden}.sidebar__header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;gap:var(--space-2)}.sidebar__header .brand{font-size:var(--text-lg);font-weight:var(--weight-bold)}.sidebar__section-title{font-size:var(--text-md);font-weight:var(--weight-semibold);margin:0;padding:var(--space-2) var(--space-4) var(--space-1);color:var(--color-muted);display:flex;justify-content:space-between;align-items:center}.doc-list{overflow-y:auto;flex:1;margin:0;padding:0;list-style:none}.doc-list li{padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--color-border);border-left:3px solid transparent;cursor:pointer;transition:background var(--transition-fast)}.doc-list li:hover{background:var(--color-bg)}.doc-list li.active{background:var(--color-bg);border-left-color:var(--color-accent)}.doc-list .title{display:block;font-weight:var(--weight-semibold);font-size:var(--text-base)}.doc-list .meta{font-size:var(--text-sm);color:var(--color-muted)}.assets-section{border-top:1px solid var(--color-border);max-height:40%;display:flex;flex-direction:column}.asset-list{overflow-y:auto;margin:0;padding:0 0 var(--space-2);list-style:none;font-size:var(--text-md)}.asset-list li{display:flex;gap:var(--space-2);align-items:center;padding:var(--space-1) var(--space-4)}.asset-list .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-section{border-top:1px solid var(--color-border)}.account-bar{display:flex;gap:var(--space-2);align-items:center;justify-content:space-between;padding:var(--space-2) var(--space-4) var(--space-3)}.user-email{font-size:var(--text-sm);color:var(--color-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-pane,.preview-pane{display:flex;flex-direction:column;overflow:hidden}.editor-pane{border-right:1px solid var(--color-border)}.pane-header{display:flex;gap:var(--space-2);align-items:center;padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);background:var(--color-surface)}.pane-header .input{flex:1}.pane-header__title{font-size:var(--text-md);font-weight:var(--weight-semibold)}.pane-header__spacer{flex:1}.editor-textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--color-surface);color:var(--color-text);flex:1;border:0;border-radius:0;resize:none;padding:var(--space-4);font-family:var(--font-mono);font-size:var(--text-md);line-height:var(--leading-normal)}.editor-textarea:focus{outline:none;box-shadow:none;border:0}.rendered{flex:1;overflow-y:auto;padding:var(--space-6) var(--space-8);background:var(--color-surface);overflow-wrap:break-word;line-height:var(--leading-normal)}.rendered img{max-width:100%;height:auto}.rendered pre{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);overflow-x:auto}.rendered code{font-family:var(--font-mono);font-size:.9em}.rendered table{border-collapse:collapse;display:block;overflow-x:auto;max-width:100%;width:fit-content}.rendered th,.rendered td{border:1px solid var(--color-border);padding:var(--space-1) var(--space-3)}.rendered blockquote{margin:0;padding:2px var(--space-4);border-left:3px solid var(--color-accent);color:var(--color-muted)}.diagram{margin:var(--space-4) 0;overflow-x:auto}.diagram svg{max-width:100%;height:auto}.diagram-error{color:var(--color-danger);background:var(--color-danger-soft);border:1px solid var(--color-danger-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:var(--text-md);white-space:pre-wrap}.login-body{display:grid;place-items:center;min-height:100vh;min-height:100dvh;padding:var(--space-6);background:radial-gradient(600px 400px at 15% 10%,var(--color-accent-soft),transparent 60%),radial-gradient(700px 500px at 90% 90%,var(--color-accent-softer),transparent 60%),var(--color-bg)}.login-card{display:grid;grid-template-columns:300px 1fr;width:min(760px,100%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg)}.login-brand{background:linear-gradient(160deg,var(--color-accent),var(--color-accent-strong));color:var(--color-on-accent);padding:var(--space-9) 30px;display:flex;flex-direction:column}.login-brand .brand-logo{margin-bottom:var(--space-4)}.login-brand .brand{font-size:var(--text-2xl);font-weight:var(--weight-bold);margin-bottom:var(--space-1)}.login-brand p{margin:0 0 var(--space-5);opacity:.85;font-size:var(--text-base)}.login-features{list-style:none;margin:auto 0 0;padding:0;display:grid;gap:var(--space-2)}.login-features li{font-size:var(--text-md);opacity:.92;padding-left:var(--space-6);position:relative}.login-features li:before{content:"";position:absolute;left:0;top:2px;width:15px;height:15px;border-radius:var(--radius-full);background:#ffffff38;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 13l4 4 10-11"/></svg>');background-size:9px;background-position:center;background-repeat:no-repeat}.brand-site{margin-top:var(--space-4);color:#ffffffbf;font-size:var(--text-sm);text-decoration:none}.brand-site:hover{color:var(--color-on-accent);text-decoration:underline}.login-form-panel{padding:var(--space-9) 38px}.login-form-panel h1{margin:var(--space-5) 0 var(--space-1);font-size:var(--text-2xl)}.login-sub{margin:0 0 var(--space-5);color:var(--color-muted);font-size:var(--text-md)}.login-form-panel form{display:flex;flex-direction:column;gap:var(--space-4)}.login-tabs{display:flex;gap:var(--space-1);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-1);width:fit-content}.login-tabs .btn{border:0;background:transparent;color:var(--color-muted);height:30px;padding:0 var(--space-4)}.login-tabs .btn.active{background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-sm)}.login-switch{margin:var(--space-4) 0 0;font-size:var(--text-md);color:var(--color-muted)}.login-switch a{font-weight:var(--weight-semibold);text-decoration:none}.login-switch a:hover{text-decoration:underline}.share-wrap{max-width:860px;margin:0 auto;padding:var(--space-8) var(--space-5) 80px}.share-wrap .rendered{padding:0;background:transparent;overflow:visible}.share-header{border-bottom:1px solid var(--color-border);margin-bottom:var(--space-6);padding-bottom:var(--space-3)}.share-header h1{margin:0 0 var(--space-1)}.share-header .meta{color:var(--color-muted);font-size:var(--text-md)}.share-badge{float:right;font-size:var(--text-sm);color:var(--color-muted);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:3px var(--space-2)}.share-footer{margin-top:48px;padding-top:var(--space-4);border-top:1px solid var(--color-border);font-size:var(--text-md);color:var(--color-muted)}.share-footer a{text-decoration:none}.share-footer a:hover{text-decoration:underline}@media (max-width: 1150px){.app{grid-template-columns:210px 1fr 1fr}}@media (max-width: 900px){.app{display:flex;flex-direction:column}.sidebar,.editor-pane,.preview-pane{display:none;flex:1;min-height:0;border-right:0}.sidebar{width:100%}body[data-view=docs] .sidebar,body[data-view=edit] .editor-pane,body[data-view=preview] .preview-pane{display:flex}.mobile-nav{display:flex;border-top:1px solid var(--color-border);background:var(--color-surface);padding-bottom:env(safe-area-inset-bottom)}.mobile-nav .btn{flex:1;flex-direction:column;gap:3px;height:auto;min-height:var(--touch-target);padding:var(--space-2) var(--space-1);border:0;border-radius:0;background:transparent;font-size:var(--text-xs);color:var(--color-muted)}.mobile-nav .btn.active{color:var(--color-accent)}.btn{height:38px}.btn--sm{height:30px}.input,.textarea,.editor-textarea{font-size:16px}.editor-textarea{padding:var(--space-3)}.pane-header{flex-wrap:wrap;gap:var(--space-1);padding:var(--space-2)}.pane-header .input{flex:1 1 100%}.rendered{padding:var(--space-4)}.doc-list li{padding:var(--space-3) var(--space-4)}.asset-list li{padding:var(--space-2) var(--space-4)}.assets-section{max-height:32%}}@media (max-width: 640px){.login-card{grid-template-columns:1fr}.login-brand{padding:var(--space-6) 30px}.login-features{display:none}.login-form-panel{padding:var(--space-6) 26px}.share-wrap{padding:var(--space-5) var(--space-3) 60px}.share-header h1{font-size:var(--text-2xl)}.dialog{padding:var(--space-4) var(--space-5)}}
