code[class*=language-],pre[class*=language-]{color:#ccc;background:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata{color:#999}.token.punctuation{color:#ccc}.token.tag,.token.attr-name,.token.namespace,.token.deleted{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.number,.token.function{color:#f08d49}.token.property,.token.class-name,.token.constant,.token.symbol{color:#f8c555}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin{color:#cc99cd}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable{color:#7ec699}.token.operator,.token.entity,.token.url{color:#67cdcc}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}:root{--primary-color: #8B7355;--primary-hover: #6B5544;--bg-primary: #F5F1EB;--bg-secondary: #FAF8F5;--bg-card: #FFFDFB;--text-primary: #3D3833;--text-secondary: #7A746A;--border-color: #E5DED5;--success-color: #6B8E5C;--error-color: #B86853;--warning-color: #B89B4D;--sidebar-width: 240px;--code-bg: #F0EBE3;--code-text: #4A453D}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Noto Sans SC,Hiragino Sans GB,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.7;font-weight:400;letter-spacing:.01em}.app-layout{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);border-right:1px solid var(--border-color);position:fixed;top:0;left:0;bottom:0;overflow-y:auto;z-index:100}.sidebar-header{padding:20px;border-bottom:1px solid var(--border-color)}.logo{font-size:1.25rem;font-weight:700;color:var(--text-primary);text-decoration:none}.nav-list{list-style:none;padding:10px 0;margin:0}.nav-list li a{display:block;padding:10px 20px;color:var(--text-secondary);text-decoration:none;font-size:.9rem;transition:all .2s}.nav-list li a:hover{background:#8b735514;color:var(--primary-color)}.nav-list li a.active{background:#8b73551f;color:var(--primary-color);border-left:2px solid var(--primary-color)}.main-content{margin-left:var(--sidebar-width);flex:1;padding:30px 40px;min-height:100vh}.nav-group{margin-bottom:10px}.nav-group-title{padding:12px 20px 6px;font-size:.85rem;font-weight:700;color:var(--primary-color);letter-spacing:.02em;border-bottom:1px solid var(--border-color);margin-bottom:4px}.nav-subgroup{margin-bottom:2px}.nav-subgroup-title{display:flex;align-items:center;gap:6px;width:100%;padding:8px 20px;font-size:.82rem;font-weight:500;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;text-align:left;transition:all .2s}.nav-subgroup-title:hover{background:#8b73550f;color:var(--text-primary)}.nav-subgroup-title.has-active{color:var(--primary-color)}.collapse-icon{font-size:.6rem;transition:transform .2s ease;opacity:.6}.collapse-icon.expanded{transform:rotate(90deg)}.nav-subgroup .nav-list{padding:0 0 4px}.nav-subgroup .nav-list li a{padding:8px 20px 8px 32px;font-size:.85rem}.question-page{max-width:900px;margin:0 auto}.question-header{margin-bottom:30px}.question-header .question-id{display:inline-block;background:var(--bg-secondary);color:var(--primary-color);padding:6px 14px;border-radius:4px;font-size:.85rem;font-weight:500;border:1px solid var(--border-color)}.question-header h1{font-size:1.8rem;margin:0;color:var(--text-primary);line-height:1.4}.key-points{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;padding:20px;margin-bottom:30px}.key-points h3{margin:0 0 15px;font-size:1.1rem;color:var(--primary-color)}.key-points ul{margin:0;padding-left:20px}.key-points li{margin:10px 0;color:var(--text-secondary)}.key-points li strong{color:var(--text-primary)}.key-points code{background:var(--code-bg);padding:2px 8px;border-radius:3px;color:var(--code-text);font-size:.9em}.home-page{max-width:1200px;margin:0 auto}.hero{text-align:center;padding:60px 0}.hero h1{font-size:2.5rem;margin-bottom:16px;color:var(--text-primary);font-weight:500;letter-spacing:-.02em}.tagline{font-size:1.25rem;color:var(--text-secondary);margin-bottom:24px}.version-badges{display:flex;gap:12px;justify-content:center}.badge{background:var(--bg-secondary);color:var(--primary-color);padding:6px 16px;border-radius:4px;font-size:.85rem;font-weight:400;border:1px solid var(--border-color)}.categories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}.category-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:24px}.category-card h2{font-size:1.25rem;margin:0 0 8px;color:var(--primary-color)}.category-desc{color:var(--text-secondary);font-size:.9rem;margin-bottom:16px}.hooks-list{list-style:none;padding:0;margin:0}.hook-link{display:flex;flex-direction:column;padding:12px;margin:-4px -12px;border-radius:8px;text-decoration:none;transition:all .2s}.hook-link:hover{background:#8b73550f}.hook-name{font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px}.hook-desc{font-size:.85rem;color:var(--text-secondary);margin-top:4px}.new-badge{background:var(--success-color);color:#000;font-size:.7rem;padding:2px 6px;border-radius:4px;font-weight:700}.version-badge{background:#ffffff1a;font-size:.7rem;padding:2px 6px;border-radius:4px}.home-footer{text-align:center;padding:40px 0;color:var(--text-secondary)}.home-footer a{color:var(--primary-color)}.hook-page{max-width:900px;margin:0 auto}.hook-header{margin-bottom:40px}.hook-header h1{font-size:2.5rem;margin-bottom:16px;color:var(--primary-color)}.hook-description{font-size:1.1rem;color:var(--text-secondary);line-height:1.8}.hook-description code{background:var(--code-bg);padding:2px 8px;border-radius:3px;color:var(--code-text)}.hook-syntax{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:16px 20px;margin-top:20px}.hook-syntax h4{margin:0 0 8px;color:var(--text-secondary);font-size:.85rem}.hook-syntax pre{margin:0;font-family:SF Mono,Fira Code,monospace;color:var(--code-text)}.demos-container{display:flex;flex-direction:column;gap:32px}.demo-container{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:24px}.demo-container h3{margin:0 0 20px;font-size:1.25rem;color:var(--text-primary);padding-bottom:12px;border-bottom:1px solid var(--border-color)}.demo-section{margin-bottom:20px}.demo-section h4{margin:0 0 12px;font-size:1rem;color:var(--text-secondary)}button{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-color);padding:10px 20px;border-radius:4px;cursor:pointer;font-size:.95rem;font-weight:400;transition:all .3s ease}button:hover{background:var(--bg-secondary);border-color:var(--primary-color);color:var(--primary-color)}button:disabled{opacity:.5;cursor:not-allowed}button.active{background:var(--primary-color);color:var(--bg-card);border-color:var(--primary-color)}.button-group{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.wrong-btn{background:var(--error-color)}.correct-btn{background:var(--success-color);color:#000}.reset-btn{background:#ffffff1a}.delete-btn{background:var(--error-color);padding:4px 12px;font-size:.85rem}input,textarea{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary);padding:10px 14px;border-radius:8px;font-size:.95rem;width:100%;max-width:300px}input:focus,textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #8b735526}textarea{max-width:none;min-height:150px;resize:vertical;font-family:Fira Code,monospace}.input-group{display:flex;gap:10px;align-items:center;margin:12px 0}.code-explain{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;padding:16px 20px;margin-top:20px}.code-explain h4{margin:0 0 12px;color:var(--primary-color)}.code-explain ul{margin:0;padding-left:20px}.code-explain li{margin:8px 0;color:var(--text-secondary)}.code-explain code{background:var(--code-bg);padding:2px 6px;border-radius:3px;color:var(--code-text);font-size:.9em}.code-block{background:#2d2d2d;border-radius:6px;padding:16px;overflow-x:auto;font-family:SF Mono,Fira Code,monospace;font-size:.85rem;line-height:1.6;color:#ccc;border:none}.compare-group{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}.compare-item{padding:16px;border-radius:8px;border:1px solid var(--border-color)}.compare-item.wrong{border-color:var(--error-color);background:#f871711a}.compare-item.correct{border-color:var(--success-color);background:#4ade801a}.compare-item h5{margin:0 0 12px;font-size:.9rem}.compare-item .explain{font-size:.85rem;color:var(--text-secondary);margin-top:8px}.compare-table{width:100%;border-collapse:collapse;margin:16px 0}.compare-table th,.compare-table td{padding:12px;text-align:left;border-bottom:1px solid var(--border-color)}.compare-table th{background:var(--bg-secondary);color:var(--text-secondary);font-weight:500}.compare-table td code{background:var(--code-bg);padding:2px 6px;border-radius:3px}.todo-list,.item-list{list-style:none;padding:0;margin:16px 0}.todo-list li{display:flex;align-items:center;justify-content:space-between;padding:12px;background:var(--bg-secondary);border-radius:8px;margin-bottom:8px}.todo-list li.done span{text-decoration:line-through;opacity:.5}.item-list .item{padding:8px 12px;background:var(--bg-secondary);border-radius:4px;margin-bottom:4px}.log-container{background:var(--bg-secondary);border-radius:8px;padding:16px;max-height:200px;overflow-y:auto}.log-item{font-family:Fira Code,monospace;font-size:.85rem;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.05)}.status-indicator{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:20px;font-weight:500}.status-indicator.online{background:#4ade8033;color:var(--success-color)}.status-indicator.offline{background:#f8717133;color:var(--error-color)}.status-dot{width:10px;height:10px;border-radius:50%;background:currentColor}.loading{text-align:center;padding:40px;color:var(--text-secondary)}.pending{opacity:.6;transition:opacity .2s}.loading-overlay{position:absolute;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;border-radius:8px}.demo-form{display:flex;flex-direction:column;gap:16px}.form-field{display:flex;flex-direction:column;gap:6px}.form-field label{font-size:.9rem;color:var(--text-secondary)}.form-field input{max-width:none}.form-field .error{color:var(--error-color);font-size:.85rem}.warning{background:#fbbf241a;border:1px solid var(--warning-color);border-radius:8px;padding:12px 16px;margin-top:16px;color:var(--warning-color)}.large-number{font-size:2rem;font-weight:700;color:var(--primary-color)}.hint{font-size:.85rem;color:var(--text-secondary);font-style:italic}.highlight{background:#8b73551a;padding:8px 16px;border-radius:6px;margin-top:8px}.user-card{background:var(--bg-secondary);border-radius:8px;padding:16px;margin:12px 0}.user-card p{margin:8px 0}.counters-row{display:flex;gap:16px}.counter-box{flex:1;background:var(--bg-secondary);border-radius:8px;padding:16px;text-align:center}.counter-box h5{margin:0 0 8px;color:var(--text-secondary)}.counter-box p{font-size:1.5rem;font-weight:700;color:var(--primary-color);margin:8px 0}.editor-preview{display:grid;grid-template-columns:1fr 1fr;gap:16px}.editor-pane,.preview-pane{background:var(--bg-secondary);border-radius:8px;padding:16px}.editor-pane h4,.preview-pane h4{margin:0 0 12px;color:var(--text-secondary);font-size:.9rem}.preview-pane.stale{opacity:.7}.preview-content h1{font-size:1.5rem;margin:0 0 12px}.preview-content h2{font-size:1.25rem;margin:0 0 8px}.preview-content p{margin:8px 0}.message-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.message{background:var(--bg-secondary);padding:10px 14px;border-radius:8px;display:flex;justify-content:space-between;align-items:center}.message.sending{opacity:.6;border:1px dashed var(--border-color)}.sending-indicator{font-size:.8rem;color:var(--text-secondary)}.message-form{display:flex;gap:8px}.message-form input{flex:1;max-width:none}.result{padding:12px 16px;border-radius:8px;margin-top:16px}.result.success{background:#4ade8033;color:var(--success-color)}.result.error{background:#f8717133;color:var(--error-color)}.accessible-input .description{color:var(--text-secondary);font-size:.85rem}.accessible-input .error{color:var(--error-color);font-size:.85rem}.accordion{display:flex;flex-direction:column;gap:8px}.accordion-item{background:var(--bg-secondary);border-radius:8px;overflow:hidden}.accordion-item h4{margin:0}.accordion-item button{width:100%;text-align:left;background:transparent;border-radius:0;padding:14px 16px}.accordion-item>div{padding:0 16px 14px;color:var(--text-secondary)}.tabs{display:flex;gap:8px;margin-bottom:16px}.tabs button{background:var(--bg-secondary)}.tabs button.active{background:var(--primary-color)}.tab-content{max-height:200px;overflow-y:auto}.tab-item{padding:8px 12px;border-bottom:1px solid var(--border-color)}.content-area{position:relative;min-height:200px}.search-input{max-width:none;margin-bottom:16px}.filter-controls{margin-bottom:16px}.category-buttons{display:flex;gap:8px;margin-top:12px}.category-buttons button{background:var(--bg-secondary);padding:6px 14px}.category-buttons button.active{background:var(--primary-color)}.effect-timing .timeline{display:flex;align-items:center;gap:8px;padding:16px 0;overflow-x:auto}.timeline .step{background:var(--bg-secondary);padding:8px 14px;border-radius:6px;font-size:.85rem;white-space:nowrap}.timeline .step.highlight{background:var(--primary-color);color:#fff}.timeline .arrow{color:var(--text-secondary)}.value-compare{display:flex;gap:16px;margin:16px 0}.value-box{flex:1;background:var(--bg-secondary);padding:16px;border-radius:8px}.value-box h5{margin:0 0 8px;color:var(--text-secondary);font-size:.85rem}.value-box p{margin:0;font-family:Fira Code,monospace;word-break:break-all}.value-box.stale{border:1px dashed var(--warning-color)}.post-card{background:var(--bg-secondary);padding:20px;border-radius:8px}.post-card h4{margin:0 0 12px;color:var(--primary-color)}.post-card p{margin:0;color:var(--text-secondary)}.post-selector{display:flex;gap:8px;margin-bottom:16px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}@media(max-width:768px){.sidebar{display:none}.main-content{margin-left:0;padding:20px}.compare-group,.editor-preview{grid-template-columns:1fr}.hero h1{font-size:2rem}}.question-page .priority-box,.question-page .compare-box,.question-page .result-box,.question-page .child-box,.question-page .list-preview,.question-page .slow-list{background:var(--bg-secondary)!important;color:var(--text-primary);border:1px solid var(--border-color)}.question-page .result-list li,.question-page .list-preview li,.question-page .slow-item{background:var(--bg-card)!important;color:var(--text-primary)}.question-page .state-display span:not(.render-badge){background:var(--bg-secondary)!important;color:var(--text-primary)}.question-page .compare-table th,.question-page .compare-table td{color:var(--text-primary);background:var(--bg-card);border:1px solid var(--border-color)}.question-page .compare-table th{background:var(--bg-secondary);color:var(--text-secondary)}.question-page input,.question-page textarea,.question-page select{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color)}.question-page .child-box.no-memo,.question-page .result-box.no-memo{background:#f8717126!important;border-color:var(--error-color)}.question-page .child-box.with-memo,.question-page .result-box.with-memo{background:#4ade8026!important;border-color:var(--success-color)}code[class*=language-],pre[class*=language-]{font-family:SF Mono,Fira Code,Menlo,Monaco,Consolas,monospace;font-size:.875rem;line-height:1.6;tab-size:2}pre[class*=language-]{padding:1.25rem;margin:0;border-radius:6px}:not(pre)>code[class*=language-],:not(pre)>code{padding:.2em .5em;border-radius:4px;background:var(--code-bg);color:var(--code-text)}.code-block{background:#2d2d2d!important;border-radius:6px;padding:1.25rem;overflow-x:auto;font-family:SF Mono,Fira Code,monospace;font-size:.875rem;line-height:1.6;color:#ccc;border:none}.code-block code{background:transparent!important;padding:0;color:inherit}.like-btn{display:inline-flex;align-items:center;gap:8px;font-size:1.1rem;padding:12px 24px}.like-btn.liked{color:#b86853;border-color:#b86853;background:var(--bg-secondary)}.status-text{margin-top:12px;font-size:.9rem;color:var(--text-secondary)}.sending-indicator{margin-left:8px;font-size:.8rem;color:var(--primary-color);font-style:italic}.message.sending{opacity:.6}.error-banner{background:var(--error-color);color:#fff;padding:8px 16px;border-radius:4px;margin-bottom:16px;font-size:.9rem}.todo-list li.completed{opacity:.5;text-decoration:line-through}