.app-header{height:auto;min-height:88px;gap:24px;padding-top:16px;padding-bottom:16px}.header-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px}.notes-top-group{border-left:1px solid var(--border);padding-left:12px}.notes-top-actions{display:flex;flex-wrap:wrap;gap:6px}.notes-top-group small{display:block;font-size:11px;line-height:1.6;color:var(--muted);margin-top:4px;max-width:270px}.section-navigation{position:relative;gap:12px}.nav-tree{position:relative}.nav-tree>summary{list-style:none;cursor:pointer;min-height:36px;font-size:14px;padding:5px 12px;border-radius:6px;color:var(--ink)}.nav-tree>summary:after{content:'⌄';margin-left:8px;color:var(--muted)}.nav-tree.is-active>summary,.nav-tree[open]>summary{background:var(--indigo-wash);color:var(--indigo)}.nav-children{position:absolute;top:calc(100% + 8px);left:0;z-index:40;min-width:210px;padding:8px;border:1px solid var(--border);border-radius:8px;background:var(--paper);box-shadow:0 12px 30px #25283222;display:grid;gap:5px}.nav-children>button,.nav-children>a{display:block;text-align:left;min-height:38px;font-size:14px;padding:7px 10px;border-radius:5px}.nav-children>a:hover{background:var(--indigo-wash)}.note-conflicts{border-top:1px solid var(--border);margin-top:18px;padding-top:18px}.note-conflicts p{font-size:13px;margin:8px 0;white-space:pre-wrap;overflow-wrap:anywhere}.note-conflict-actions{display:flex;flex-wrap:wrap;gap:8px}.note-sync-caption{font-size:12px;color:var(--muted);margin:12px 0}.case-tabs{display:flex;flex-wrap:wrap;gap:8px;border-bottom:1px solid var(--border);padding:18px 0;margin-bottom:18px}.case-tabs button[aria-selected=true]{background:var(--indigo-wash);color:var(--indigo);border-color:#c9c7db}.case-library-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;margin-top:20px}.case-library-sidebar{min-width:0}.case-search{width:100%;min-height:40px;border:1px solid var(--border);border-radius:6px;padding:8px 10px;background:var(--paper);color:var(--ink);font:inherit;margin:12px 0}.case-list{display:grid;gap:8px}.case-list button{text-align:left;min-width:0}.case-list button[aria-current=true]{background:var(--indigo-wash);border-color:#bcbcd0}.case-list b,.case-list small{display:block;overflow-wrap:anywhere}.case-list small{font-size:12px;color:var(--muted)}.case-list .case-empty{font-size:13px;color:var(--muted);padding:12px 0}.case-main{min-width:0}.case-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.case-heading h2{font:26px/1.5 SimSun,serif}.case-heading p,.case-description{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.9;color:var(--muted);margin-top:12px}.case-actions{display:flex;gap:8px;flex-wrap:wrap}.case-editor{margin-top:20px;border-top:1px solid var(--border);padding-top:20px}.case-editor>label{display:block;font-size:14px;margin:16px 0}.case-editor input,.case-editor textarea,.case-editor select{display:block;width:100%;min-width:0;margin-top:7px;padding:9px 10px;border:1px solid var(--border);border-radius:6px;background:var(--paper);color:var(--ink);font:inherit}.case-editor textarea{min-height:100px;line-height:1.8}.case-editor .profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}.case-editor .profile-grid label{font-size:13px}.case-editor .profile-grid select{width:100%}.case-editor-status{font-size:13px;color:var(--muted);margin:12px 0;overflow-wrap:anywhere}.case-empty-main{padding:30px 0;font-size:14px;color:var(--muted)}.case-delete-confirm{background:#f8eeee;border:1px solid #ead3d5;padding:14px;border-radius:6px;margin-top:18px;font-size:14px}.case-delete-confirm button{margin:12px 8px 0 0}.case-scope-note{font-size:13px;color:var(--muted);line-height:1.8}.case-editor input:focus-visible,.case-editor select:focus-visible,.case-editor textarea:focus-visible,.case-search:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}
.birth-controls{margin:18px 0;padding:16px;border:1px solid var(--border);border-radius:7px;background:var(--surface)}.birth-controls label{display:block;font-size:13px}.birth-controls select,.birth-controls input:not([type=checkbox]){width:100%;min-height:40px;font:inherit;margin-top:6px;padding:8px;border:1px solid var(--border);border-radius:6px;background:var(--paper);color:var(--ink)}.birth-method-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.birth-date-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.birth-controls .birth-leap{display:flex;align-items:center;gap:8px}.birth-controls .birth-leap input{width:auto;margin:0}.birth-input-caption,.birth-input-result{font-size:12px;line-height:1.85;color:var(--muted);margin-top:12px}.birth-input-result{color:var(--indigo)}.birth-controls [hidden]{display:none!important}#self-profile-editor{margin:20px 0}.birth-controls input:focus-visible,.birth-controls select:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}
@media(max-width:600px){.birth-method-fields,.birth-date-fields{grid-template-columns:1fr}.birth-controls input:not([type=checkbox]),.birth-controls select{font-size:16px}}
@media(max-width:900px){.app-header{align-items:flex-start;padding:16px;flex-wrap:wrap}.header-actions{justify-content:flex-start;gap:8px}.notes-top-group{border:0;padding:0}.nav-children{min-width:190px}.case-library-layout{grid-template-columns:1fr}.case-list{grid-template-columns:repeat(2,minmax(0,1fr))}.case-heading{flex-wrap:wrap}.case-editor .profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.header-actions{width:100%}.notes-top-group{width:100%;order:5}.notes-top-group small{max-width:none}.section-navigation{gap:6px}.nav-tree>summary{padding:5px 9px}.nav-children{position:static;box-shadow:none;margin-top:6px;min-width:0}.nav-tree[open]{width:100%}.nav-tree[open]>.nav-children{grid-template-columns:1fr 1fr}.case-list{grid-template-columns:1fr}.case-editor input,.case-editor textarea,.case-editor select{font-size:16px}}

/* Keep the note toolbar steady during background synchronization. */
.notes-top-group{flex:0 0 282px;width:282px;min-width:0}.notes-top-group small{width:270px;max-width:100%;min-height:3.2em;overflow-wrap:anywhere}.notes-top-actions{min-height:36px;align-items:flex-start}.header-actions #note-count{display:inline-block;min-width:2ch;text-align:center;font-variant-numeric:tabular-nums}
/* Standalone reading and tool surfaces share one content measure and gutter. */
#guide-panel,#tools-panel{width:calc(100% - 60px);max-width:1150px;margin:28px auto;padding:32px 36px;min-width:0}.guide-layout{grid-template-columns:220px minmax(0,1fr);gap:28px}.lesson-content{min-width:0}.learning-route{margin:22px 0 26px}.learning-route button{min-height:76px}
@media(max-width:900px){
 body>.app-header,body.hexagram-view>.app-header{height:auto;min-height:0;padding:16px;gap:16px;flex-wrap:wrap;align-items:flex-start}
 body .app-header .header-actions{width:100%;flex-wrap:wrap;justify-content:flex-start;gap:8px;font-size:14px;align-items:center}
 body .app-header .brand{gap:13px;font-size:14px;line-height:1.7}
 body .app-header .brand-glyph{width:32px;height:35px;font-size:24px}
 body .app-header .brand small{display:block;font-size:10px}
 body .app-header .local-badge{display:none}
 body .app-header .header-actions button,body .app-header .button-link{min-height:36px;padding:5px 11px;font-size:13px;line-height:1.7;white-space:nowrap}
 body .notes-top-group{border:0;padding:0}
 #guide-panel,#tools-panel{width:calc(100% - 32px);margin:18px auto;padding:22px 18px}
 .guide-layout{grid-template-columns:1fr;gap:24px}
 body>.section-navigation,body.hexagram-view>.section-navigation{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 16px;overflow:visible;white-space:normal;min-height:0}
 body>.section-navigation>button,body>.section-navigation>a,body>.section-navigation>.nav-tree>summary,body.hexagram-view>.section-navigation>button,body.hexagram-view>.section-navigation>a{flex:0 0 auto;max-width:100%;height:40px;min-height:40px;padding:7px 10px;font-size:14px;line-height:1.7;white-space:nowrap}
}
@media(max-width:600px){
 body .notes-top-group{width:100%;flex-basis:100%;order:5}
 body .notes-top-group small{width:100%;min-height:3.2em}
 body>.section-navigation>.nav-tree[open]{width:100%}
 body>.section-navigation .nav-children{position:static;box-shadow:none;min-width:0;grid-template-columns:repeat(2,minmax(0,1fr))}
 body>.section-navigation .nav-children>button{white-space:nowrap}
}