#mystic-workspace{--m-ink:#23384b;--m-line:#dce3e8;--m-paper:#fff;--m-soft:#f5f7fa;--m-accent:#325e82;color:var(--m-ink)}
#mystic-workspace button{font:inherit;cursor:pointer;border:1px solid var(--m-line);border-radius:9px;background:var(--m-paper);color:var(--m-ink);padding:9px 14px;min-height:40px}
#mystic-workspace button:hover:not(:disabled){border-color:var(--m-accent);background:#edf3f8}
#mystic-workspace button:disabled{opacity:.45;cursor:default}
#mystic-workspace button[aria-pressed=true]{background:var(--m-accent);color:#fff;border-color:var(--m-accent)}
#mystic-workspace :focus-visible{outline:3px solid #70a6cb;outline-offset:3px}
#mystic-workspace h2,#mystic-workspace h3,#mystic-workspace p{margin:0}
#mystic-workspace h2{font-size:19px}#mystic-workspace h3{font-size:15px}#mystic-workspace p,#mystic-workspace small{color:#667586;font-size:12px;line-height:1.7}
.mystic-nav{display:flex;gap:20px;border-bottom:1px solid var(--m-line);margin-bottom:24px}.mystic-nav a{padding:10px 0;color:#697785}.mystic-nav a[aria-current]{border-bottom:2px solid var(--m-accent);color:var(--m-accent);font-weight:700}
.mystic-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}#mystic-workspace .mystic-heading h2{font-family:Songti SC,STSong,serif;font-size:28px;letter-spacing:2px;margin-bottom:7px}.mystic-heading p{display:flex;gap:7px;flex-wrap:wrap}.mystic-heading p span{margin-left:10px}.mystic-clock{font-size:12px;color:#667586;white-space:nowrap}.mystic-clock strong{display:block;font-size:27px;color:var(--m-ink);font-variant-numeric:tabular-nums}
#mystic-sync:empty{display:none}#mystic-workspace #mystic-sync{margin:10px 0;color:#a65b24}
.mystic-orbit{background:linear-gradient(155deg,#f4f8fc,#fff 65%);border:1px solid #d4e0e9;border-radius:20px;overflow:hidden;padding:24px}.mystic-orbit-head,.mystic-section-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.mystic-orbit-head small{display:block;margin-top:4px}.mystic-orbit-head strong{font-size:15px}.mystic-orbit-head strong span{margin-left:8px;color:var(--m-accent)}.mystic-view{display:flex;gap:6px}.mystic-canvas-wrap{position:relative}.mystic-canvas-wrap canvas{display:block;width:100%;height:370px;touch-action:pan-y;cursor:grab}.mystic-canvas-wrap p{position:absolute;bottom:0;left:0;right:0;text-align:center;pointer-events:none}.mystic-chart-legend{display:flex;justify-content:center;gap:16px;font-size:11px;color:#748391;margin:14px 0 20px}
#mystic-detail{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--m-line);padding:20px 0}#mystic-detail>div:first-child{display:flex;align-items:center;gap:14px}#mystic-detail strong,#mystic-detail small{display:block}#mystic-detail strong{font-size:15px}.mystic-number{background:var(--ball);color:white;width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-size:21px;font-weight:700}.mystic-focus{text-align:right}.mystic-focus>div{display:flex;gap:6px;margin-top:6px}
.mystic-number-list{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:5px}#mystic-workspace .mystic-number-list button{padding:6px 0;min-height:32px;font-size:12px}.mystic-overview,.mystic-rituals,.mystic-settings{margin-top:30px}.mystic-section-head>span{font-size:12px;color:#6a7885}.mystic-top{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:16px 0}#mystic-workspace .mystic-top button{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px}.mystic-top strong{font-size:15px}
.mystic-summary{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border:1px solid var(--m-line);border-radius:12px;background:var(--m-paper);overflow:hidden}.mystic-summary article{padding:14px;border-right:1px solid var(--m-line)}.mystic-summary article:last-child{border:0}.mystic-summary h3{margin-bottom:12px!important}.mystic-summary article>div{display:grid;grid-template-columns:1fr auto;gap:2px;font-size:12px;margin:7px 0}.mystic-summary strong{font-size:12px}.mystic-summary small{grid-column:2;text-align:right;font-variant-numeric:tabular-nums}
.mystic-ritual-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:16px}.mystic-ritual-grid article,.mystic-birth{background:var(--m-paper);padding:22px;border:1px solid var(--m-line);border-radius:12px}.mystic-ritual-grid article>p{margin:10px 0!important}.mystic-ritual-empty{text-align:center;font-family:serif;font-size:76px;line-height:1.8;color:#7d8fa0}.mystic-hex-lines{display:flex;flex-direction:column;gap:7px;margin:18px 0}.mystic-hex-lines>div{display:flex;align-items:center;gap:16px}.mystic-hex-lines>div>span{width:90px;height:7px;background:#44617a;border-radius:1px}.mystic-hex-lines .yin{background:linear-gradient(to right,#44617a 0 43%,transparent 43% 57%,#44617a 57% 100%)}.mystic-tarot{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin:25px 0}#mystic-workspace .mystic-tarot button{height:112px;padding:10px 0;background:repeating-linear-gradient(45deg,transparent 0 8px,#ffffff09 8px 9px),#344e67;border:3px double #b2a78d;color:#e8d8b3;border-radius:7px}.mystic-tarot span{font-size:30px;display:block}.mystic-tarot small{color:#e8d8b3!important;display:block}.mystic-tarot-name{display:block;font-size:24px;font-family:Songti SC,serif;margin:12px 0}.mystic-effect{display:flex;align-items:center;gap:8px;margin:14px 0;font-size:13px}.mystic-effect input{accent-color:var(--m-accent)}.mystic-birth{margin-top:18px}.mystic-birth form{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:15px 0}.mystic-birth form label{display:grid;gap:5px;font-size:12px}.mystic-birth input{min-height:40px;padding:8px 12px;border-radius:8px;border:1px solid var(--m-line)}
.mystic-presets,.mystic-routes{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.mystic-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mystic-control-grid article{padding:20px;background:var(--m-soft);border:1px solid var(--m-line);border-radius:12px}.mystic-control-grid p{margin-top:12px!important}.mystic-control-grid input[type=range]{width:100%;padding:0;height:30px;accent-color:var(--m-accent);cursor:pointer}.mystic-control-grid input[type=checkbox]{accent-color:var(--m-accent)}.mystic-control-grid .mystic-section-head label{font-size:13px}.mystic-control-grid .mystic-section-head button{min-height:30px!important;padding:4px 8px!important;font-size:11px!important}.mystic-range-labels{display:flex;justify-content:space-between;color:#68788a;font-size:12px;margin-top:14px}.mystic-window-label{display:flex;align-items:center;justify-content:flex-end;gap:8px;font-size:12px;margin-top:10px}.mystic-window-label select{width:auto;min-height:32px;padding:5px 10px}.mystic-control-grid article>strong{display:block;margin-top:16px;font-size:14px}#mystic-workspace .mystic-notice{margin:22px 0;padding:15px 18px;border-left:3px solid #b69a66;background:#fbf8f0;color:#806534}
[data-theme=dark] #mystic-workspace{--m-ink:#dfe9f0;--m-line:#465361;--m-paper:#25333f;--m-soft:#283844;--m-accent:#527fa1}[data-theme=dark] .mystic-orbit{background:#dfe9f2;color:#23384b}[data-theme=dark] #mystic-workspace p,[data-theme=dark] #mystic-workspace small{color:#92a5b4}[data-theme=dark] #mystic-workspace .mystic-orbit p,[data-theme=dark] #mystic-workspace .mystic-orbit small{color:#526779}
@media(max-width:900px){.mystic-summary{grid-template-columns:repeat(3,1fr)}.mystic-summary article:nth-child(3){border-right:0}.mystic-summary article:nth-child(-n+3){border-bottom:1px solid var(--m-line)}.mystic-top button{flex-direction:column}.mystic-ritual-grid{grid-template-columns:1fr}}
@media(max-width:600px){.mystic-heading{align-items:start}#mystic-workspace .mystic-heading h2{font-size:24px}.mystic-heading p span{margin-left:0;flex-basis:100%}.mystic-orbit{padding:14px;border-radius:15px}.mystic-orbit-head{gap:10px;align-items:start}.mystic-orbit-head strong{font-size:13px}.mystic-orbit-head small{font-size:10px!important}.mystic-orbit-head strong span{display:block;margin:4px 0}.mystic-view button{font-size:11px!important;padding:7px 9px!important;min-height:34px!important}.mystic-canvas-wrap canvas{height:290px}.mystic-chart-legend{gap:8px;font-size:10px}.mystic-number-list{grid-template-columns:repeat(7,1fr)}#mystic-detail{flex-wrap:wrap;gap:12px}.mystic-focus{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left}.mystic-top{gap:6px}.mystic-top button{padding:12px 4px!important;gap:7px!important}.mystic-top strong{font-size:12px}.mystic-top .mystic-number{width:34px;height:34px;font-size:18px}.mystic-summary article{padding:11px}.mystic-summary strong{font-size:11px}.mystic-control-grid{grid-template-columns:1fr}.mystic-ritual-grid article,.mystic-birth{padding:17px}.mystic-section-head{gap:10px}.mystic-section-head>span{max-width:45%;text-align:right}.mystic-tarot{gap:5px}#mystic-workspace .mystic-tarot button{height:90px}.mystic-presets button{flex:1 0 28%}.mystic-birth form button{flex:1}.mystic-birth form label{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){#mystic-workspace *{scroll-behavior:auto;transition:none}}

.mystic-influences{margin:0 0 18px;font-size:12px}.mystic-influences summary{cursor:pointer;margin-bottom:8px}#mystic-influences{display:flex;flex-wrap:wrap;gap:8px 20px;padding:8px 0}.mystic-influences b{font-variant-numeric:tabular-nums}

/* Compact navigation and live feedback for the existing entertainment controls. */
#mystic-workspace [hidden]{display:none!important}
.mystic-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:14px 0}.mystic-toolbar>span{font-size:12px;color:#667586;margin-left:auto}
.mystic-live-summary{padding:18px 20px;background:var(--m-paper);border:1px solid var(--m-line);border-radius:12px;margin:16px 0}.mystic-live-summary .mystic-top{margin:12px 0}.mystic-live-summary .mystic-top .mystic-number{width:32px;height:32px;font-size:17px}#mystic-workspace .mystic-live-summary .mystic-top button{padding:10px}
#mystic-active{display:flex;gap:12px;align-items:baseline;font-size:12px;line-height:1.8;flex-wrap:wrap}#mystic-active>span{color:#667586}
.mystic-tabs{display:flex;gap:6px;position:sticky;top:70px;z-index:8;background:var(--m-soft);padding:10px 0;border-bottom:1px solid var(--m-line);scroll-margin-top:70px}.mystic-tabs button{flex:1}#mystic-workspace .mystic-tabs button[aria-selected=true]{background:var(--m-accent);color:white;border-color:var(--m-accent)}
#mystic-workspace [role=tabpanel]{padding:18px 0 70px}#mystic-workspace [role=tabpanel]>section{margin-top:0}.mystic-overview{margin-bottom:20px}.mystic-overview .mystic-summary{margin-top:14px}
.mystic-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.mystic-presets button{text-align:left}.mystic-presets strong,.mystic-presets small{display:block}.mystic-presets small{margin-top:5px}#mystic-workspace .mystic-presets button[aria-pressed=true] small{color:#e5edf4}
.mystic-advanced{margin-top:18px}.mystic-advanced>summary{padding:14px 0;cursor:pointer;font-weight:600;font-size:14px}.mystic-advanced .mystic-control-grid{margin-top:10px}
.mystic-range-labels{align-items:center}.mystic-exact input{width:82px!important;padding:6px 8px!important;text-align:center;font-size:14px;background:var(--m-paper);color:var(--m-ink);border:1px solid var(--m-line);border-radius:7px;min-height:38px}.mystic-exact .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.mystic-feedback{position:fixed;left:50%;transform:translateX(-50%);bottom:20px;z-index:12;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border:1px solid var(--m-line);border-radius:12px;background:var(--m-paper);box-shadow:0 4px 18px #23384b18;width:min(660px,calc(100% - 32px));font-size:13px}.mystic-feedback button{white-space:nowrap}
@media(max-width:600px){.mystic-tabs{top:52px;scroll-margin-top:52px;gap:4px}.mystic-tabs button{padding:9px 3px!important;font-size:12px!important}.mystic-toolbar>span{width:100%;margin:0}.mystic-toolbar button{flex:1;font-size:12px!important;padding:8px!important}.mystic-live-summary{padding:14px}.mystic-live-summary .mystic-section-head{align-items:start;gap:8px}.mystic-live-summary .mystic-section-head small{max-width:45%;text-align:right}.mystic-presets{grid-template-columns:repeat(2,minmax(0,1fr))}.mystic-presets small{font-size:11px!important}.mystic-feedback{bottom:82px;font-size:11px}.mystic-feedback button{font-size:12px!important;padding:6px 8px!important}.mystic-focus{flex-wrap:wrap}.mystic-focus>div{flex-wrap:wrap}.mystic-view{flex-wrap:wrap;justify-content:flex-end}.mystic-view button{padding:6px!important}.mystic-live-summary .mystic-top .mystic-number{width:29px;height:29px;font-size:16px}}
.mystic-orbit{scroll-margin-top:135px}
@media(max-width:600px){
 #mystic-workspace .mystic-tabs button,#mystic-workspace .mystic-number-list button,#mystic-workspace .mystic-routes button{min-height:44px}
 #mystic-workspace .mystic-exact input,#mystic-workspace .mystic-birth input,#mystic-workspace select{font-size:16px!important;min-height:44px}
 .mystic-control-grid input[type=range]{height:44px}
 .mystic-feedback{bottom:calc(82px + env(safe-area-inset-bottom,0px))}
 #mystic-workspace:has(input[type=number]:focus) .mystic-feedback,#mystic-workspace:has(input[type=date]:focus) .mystic-feedback{display:none}
 #mystic-workspace [role=tabpanel]{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))}
 .mystic-orbit{scroll-margin-top:120px}
}

/* Personal chart: a compact local birthday profile and its actual weight changes. */
.mystic-birth-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid var(--m-line)}.mystic-birth-heading strong{font-size:16px}.mystic-birth-switch{display:flex;align-items:center;gap:8px;min-height:44px;font-size:13px;white-space:nowrap}.mystic-birth .mystic-birth-switch input{min-height:0;padding:0;width:20px;height:20px;accent-color:var(--m-accent)}
.mystic-birth-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.mystic-birth-grid>div{padding:14px;background:var(--m-soft);border:1px solid var(--m-line);border-radius:10px}.mystic-birth-grid strong,.mystic-birth-grid small{display:block}.mystic-birth-grid strong{font-size:23px;margin:8px 0;color:var(--m-accent)}
.mystic-birth-impact{margin:22px 0}.mystic-birth-changes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}.mystic-birth-changes strong,.mystic-birth-changes span{display:block}.mystic-birth-changes strong{font-size:22px}.mystic-birth-changes span{font-size:11px;line-height:1.6;margin-top:6px;color:var(--m-accent)}
.mystic-birth-rules{border-top:1px solid var(--m-line);padding:14px 0;font-size:13px;line-height:1.8}.mystic-birth-rules summary{cursor:pointer;min-height:44px;display:list-item;align-content:center;font-weight:600}.mystic-birth-rules ul{padding-left:20px}.mystic-birth-rules li{margin:8px 0}
@media(max-width:600px){.mystic-birth-heading{align-items:start;flex-direction:column;gap:6px}.mystic-birth-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mystic-birth-grid>div{padding:12px}.mystic-birth-grid strong{font-size:21px}#mystic-workspace .mystic-birth-changes button{padding:10px 3px;min-height:72px}.mystic-birth-changes span{font-size:10px}.mystic-birth form button{min-height:44px}}

#mystic-workspace .mystic-birth .mystic-birth-switch input{min-height:20px!important;width:20px;height:20px}

/* Mobile: one sticky navigation row; feedback stays in the document flow. */
#mystic-open-draw{display:none}
@media(max-width:600px){
 body[data-page=mystic] .workspace{padding:12px 12px calc(88px + env(safe-area-inset-bottom,0px))}
 body[data-page=mystic] .page-heading{margin-bottom:10px}
 body[data-page=mystic] .page-heading h1{font-size:22px}
 body[data-page=mystic] .page-heading .eyebrow,body[data-page=mystic] .page-heading .page-subtitle{display:none}
 body[data-page=mystic] .draw-float-wrap,body[data-page=mystic] .back-to-top{display:none!important}
 #mystic-workspace .mystic-nav{margin-bottom:14px;gap:22px}
 #mystic-workspace .mystic-nav a{min-height:44px;display:flex;align-items:center;padding:6px 0;font-size:14px}
 #mystic-workspace .mystic-heading{margin-bottom:12px;gap:10px}
 #mystic-workspace .mystic-heading h2{font-family:inherit;font-size:19px;letter-spacing:0;margin-bottom:6px}
 #mystic-workspace .mystic-heading p{font-size:13px}
 .mystic-clock{text-align:right;font-size:12px}.mystic-clock strong{font-size:25px}
 #mystic-workspace #mystic-open-draw{display:block;padding:6px 10px;min-height:44px;margin-top:5px;font-size:13px}
 #mystic-workspace .mystic-toolbar{gap:8px;margin:10px 0}
 #mystic-workspace .mystic-toolbar button{min-height:44px;font-size:13px!important}
 .mystic-toolbar>span{display:none}
 #mystic-workspace[data-panel]:not([data-panel=results]) .mystic-live-summary{display:none}
 #mystic-workspace .mystic-live-summary{margin:12px 0;padding:12px}
 #mystic-workspace .mystic-live-summary .mystic-top{gap:4px}
 #mystic-workspace .mystic-live-summary .mystic-top button{padding:10px 2px!important}
 #mystic-workspace .mystic-tabs{top:54px;scroll-margin-top:54px;padding:8px 0;gap:4px;background:var(--bg,#f5f5f7)}
 body[data-mini=true] .mystic-tabs{top:calc(58px + var(--mini-top,0px));scroll-margin-top:calc(58px + var(--mini-top,0px))}
 #mystic-workspace .mystic-tabs button{min-height:46px;padding:8px 2px!important;font-size:12px!important}
 #mystic-workspace .mystic-feedback{position:static;transform:none;width:100%;margin:12px 0 0;padding:10px 12px;box-shadow:none;font-size:12px;line-height:1.6;gap:10px}
 #mystic-workspace .mystic-feedback button{min-height:44px;flex-shrink:0}
 #mystic-workspace [role=tabpanel]{padding:14px 0 20px}
 #mystic-workspace p,#mystic-workspace small{font-size:13px;line-height:1.75}
 #mystic-workspace .mystic-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
 #mystic-workspace .mystic-summary article{padding:14px;border-right:1px solid var(--m-line);border-bottom:1px solid var(--m-line)}
 #mystic-workspace .mystic-summary article:nth-child(2n){border-right:0}
 #mystic-workspace .mystic-summary article:nth-last-child(-n+2){border-bottom:0}
 #mystic-workspace .mystic-summary article>div,#mystic-workspace .mystic-summary strong{font-size:13px}
 #mystic-workspace .mystic-tarot{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0}
 #mystic-workspace .mystic-tarot button{height:90px;min-width:44px}
 #mystic-workspace .mystic-section-head{align-items:start;flex-wrap:wrap}
 #mystic-workspace .mystic-section-head>span{max-width:none;text-align:left}
 #mystic-workspace .mystic-control-grid article{padding:16px}
 #mystic-workspace .mystic-control-grid .mystic-section-head button{min-height:44px!important;min-width:44px;padding:8px!important;font-size:12px!important}
 #mystic-workspace .mystic-effect,#mystic-workspace .mystic-control-grid .mystic-section-head label{min-height:44px;display:flex;align-items:center;gap:8px}
 #mystic-workspace .mystic-focus>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:6px}
 #mystic-workspace .mystic-focus button{min-height:44px;padding:8px 4px;font-size:13px}
 #mystic-workspace .mystic-view button{min-height:44px!important;font-size:12px!important}
 #mystic-workspace .mystic-birth{margin-top:0;padding:15px}
 #mystic-workspace .mystic-birth form label,#mystic-workspace .mystic-birth input[type=date]{width:100%;min-width:0;max-width:100%;box-sizing:border-box}
 #mystic-workspace .mystic-birth form button{min-height:46px;font-size:14px;padding:8px 6px}
 #mystic-workspace .mystic-birth form button[type=submit]{background:var(--m-accent);border-color:var(--m-accent);color:white}
 #mystic-workspace .mystic-birth-changes span{font-size:11px}
 #mystic-workspace .mystic-birth-rules{font-size:14px}
 #mystic-workspace .mystic-influences summary,#mystic-workspace .mystic-advanced>summary{min-height:44px;align-content:center}
 #mystic-workspace .mystic-canvas-wrap canvas{height:260px}
}