/* Secondary tools share the existing large, quiet visual language. */
.app-shell,.loading-state { min-height:100vh; min-height:100svh; }
dialog { max-height:calc(100vh - 40px); max-height:calc(100svh - 40px); }
.daily-plan { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:20px; padding:19px 23px; background:var(--surface); border:1px solid var(--line); border-radius:18px; }
.daily-plan strong { font-size:21px; color:var(--accent); }
.daily-plan p { font-size:17px; margin-top:4px; }
.scope-empty { background:var(--paper); padding:30px; border:1px solid var(--line); border-radius:20px; font-size:23px; }
.scope-empty .button { margin-top:20px; }
.relation-details { margin-top:23px; border:1px solid var(--accent-line); border-radius:16px; padding:0 20px 18px; background:var(--surface); }
.relation-details summary { cursor:pointer; color:var(--accent); padding:16px 0; font-size:21px; min-height:56px; font-weight:600; }
.relation-details:not([open]) { padding-bottom:0; }
.relation-details svg { height:auto; max-height:none; }
.relation-details .settings-note { margin-top:10px; }
.relation-visual { padding:8px 0; }
.relation-title { font-size:22px; color:var(--ink); margin-bottom:20px; }
.relation-quantity { padding:14px 16px; border:1px solid var(--accent-line); border-radius:12px; background:var(--paper); min-width:0; }
.relation-label { display:block; font-size:20px; color:var(--body); }
.relation-value { display:block; color:var(--accent); font-size:28px; font-weight:650; }
.relation-quantity.is-unknown { border:2px dashed var(--accent-line); }
.relation-comparison-row { display:grid; gap:8px; margin:16px 0; }
.relation-bar { border-radius:10px; background:var(--surface-strong); border:1px solid var(--accent-line); padding:12px 16px; }
.relation-comparison-row:first-of-type .relation-bar { width:70%; }
.relation-visual[data-direction="less"] .relation-bar-base { width:100%; }
.relation-visual[data-direction="less"] .relation-bar-target { width:70%; }
.relation-difference { margin:16px 0; padding:14px; border:1px dashed var(--warm-line); background:var(--warm-soft); border-radius:12px; }
.relation-parts,.relation-factors { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; }
.relation-sequence { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.relation-node { flex:1 1 120px; }
.relation-change { flex:0 1 auto; text-align:center; color:var(--accent); font-size:20px; }
.relation-arrow { display:block; font-size:27px; }
.feature-dialog { width:min(660px,calc(100% - 28px)); border-radius:24px; margin:auto; padding:28px; }
.feature-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:18px; }
.feature-heading h2 { font-size:27px; color:var(--ink); line-height:1.5; }
.dialog-close { flex:0 0 auto; border:1px solid var(--accent-line); border-radius:12px; min-height:52px; padding:10px 15px; background:var(--surface); color:var(--accent); font-size:18px; }
.feature-dialog>p { font-size:20px; line-height:1.85; }
.choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:20px 0; }
.choice-stack { display:grid; gap:13px; margin:22px 0; }
.choice-grid .button,.choice-stack .button { min-height:60px; white-space:normal; font-size:20px; line-height:1.6; }
.feature-dialog>.button { width:100%; }
.device-section { margin:26px 0; padding:23px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.device-section h3,.parent-section h3 { font-size:22px; color:var(--ink); margin-bottom:16px; }
.device-section .button { margin:14px 0; width:100%; }
.parent-dialog { width:min(830px,calc(100% - 28px)); }
.parent-section { padding:26px 0; border-bottom:1px solid var(--line); }
.parent-section:last-child { border:0; padding-bottom:5px; }
.parent-section .setting-field { margin:18px 0; }
.parent-section select { background:var(--paper); }
.parent-dialog .settings-note { font-size:17px; }
.summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.summary-card { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:17px; font-size:17px; }
.summary-card strong { display:block; font-size:29px; color:var(--accent); }
.scope-options { padding:0; border:0; margin:24px 0 12px; }
.scope-options legend { font-size:20px; color:var(--ink); margin-bottom:12px; }
.checkbox-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.scope-choice { display:flex; align-items:center; gap:12px; min-height:56px; padding:11px 14px; border:1px solid var(--line); border-radius:12px; font-size:19px; background:var(--surface); cursor:pointer; }
.scope-choice input { width:23px; height:23px; accent-color:var(--accent); flex:0 0 auto; }
.item-list { display:grid; gap:13px; margin:18px 0; }
.list-item { border:1px solid var(--line); background:var(--surface); border-radius:14px; padding:17px; }
.list-item p { font-size:18px; }
.list-item .item-title { color:var(--ink); font-size:20px; font-weight:600; }
.list-item .button { margin-top:12px; font-size:18px; min-height:54px; }
.list-item .choice-grid { margin:0; }
.practice-prompt { font-size:24px!important; font-weight:600; color:var(--ink); }
.practice-feedback { background:var(--surface); border-radius:12px; padding:16px; margin:18px 0; min-height:56px; }
.practice-feedback:empty { display:none; }
.choice-stack .button[aria-pressed="true"] { outline:3px solid var(--focus); outline-offset:2px; }
dialog.dialog-fallback[open] { display:block; position:fixed; inset:0; z-index:1002; overflow-y:auto; }
.dialog-fallback-backdrop { position:fixed; inset:0; background:var(--backdrop); z-index:1001; }
@media(max-width:540px) { .daily-plan { padding:17px; } .daily-plan .button { width:100%; } .feature-dialog { padding:22px 19px; } .feature-heading { gap:12px; } .feature-heading h2 { font-size:25px; } .choice-grid { grid-template-columns:1fr; } .checkbox-grid { grid-template-columns:1fr; } .feature-dialog .setting-field { display:block; } .feature-dialog .setting-field select { width:100%; } .relation-details { padding-left:12px; padding-right:12px; } .relation-parts,.relation-factors { grid-template-columns:1fr; } .relation-sequence { flex-direction:column; align-items:stretch; } .relation-node { flex-basis:auto; } .relation-arrow { transform:rotate(90deg); } }
@media print { .daily-plan,.relation-details,.scope-empty { display:none!important; } }
