:root{--ink:#1d4367;--ink-muted:#587a97;--mid:#3c6c97;--blue:#92c7ec;--sky:#dcecf9;--ice:#eef6ff;--navy:#1c3c55;--border:rgba(255,255,255,.78);--soft-border:rgba(87,136,177,.17);--violet:#ded9f6;--pink:#f5dce9;--aqua:#bde5f3;--radius:30px;--shadow:0 14px 40px rgba(55,107,149,.10),inset 0 1px 0 rgba(255,255,255,.9)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}body{background:radial-gradient(ellipse 72% 70% at 15% 22%,#f3f9fe 0,transparent 74%),radial-gradient(ellipse 56% 60% at 96% 93%,#ebe0f9 0,transparent 75%),linear-gradient(122deg,#dcecf9 0%,#e6f1fa 45%,#d8e8f7 100%)}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(75,135,212,.5);outline-offset:2px}a{color:var(--mid)}h1,h2,h3,p{margin-top:0}h1{font-weight:450;font-size:clamp(27px,3vw,45px);letter-spacing:-.045em;line-height:1.12;margin-bottom:6px}h2{font-weight:550;font-size:19px;letter-spacing:-.02em}h3{font-size:15px;font-weight:600}p{line-height:1.5}.micro{font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:650;color:#688bac}.muted{color:var(--ink-muted)}.sm{font-size:13px}.xs{font-size:11px}.mono{font-variant-numeric:tabular-nums}.sr-only{position:absolute;height:1px;width:1px;overflow:hidden;clip:rect(0,0,0,0)}
#root{min-height:100vh}.boot-screen{min-height:100vh;display:grid;place-content:center;text-align:center;gap:12px}.boot-screen img{max-width:230px}.boot-screen p{font-size:14px;color:var(--ink-muted)}
.app-shell{max-width:1610px;padding:26px clamp(18px,3vw,54px) 42px;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px}.logo{width:206px;height:auto;display:block}.top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.status-pill,.account-pill,.top-round{border:1px solid var(--border);box-shadow:var(--shadow);background:rgba(249,252,255,.52);color:var(--ink);border-radius:999px;padding:12px 17px;font-size:12px}.status-dot{width:8px;height:8px;border-radius:100px;display:inline-block;background:#71bca6;box-shadow:0 0 10px #71bca6;margin-right:7px}.account-pill{background:linear-gradient(130deg,rgba(184,215,244,.85),rgba(223,221,247,.65))}.account-pill strong{font-weight:600}.top-round{width:40px;height:40px;padding:0;font-size:17px}.masthead{display:flex;justify-content:space-between;gap:32px;align-items:center;margin:30px 0 29px}.masthead p{font-size:14px;margin:0;color:#688dac}.version{font-size:11px;letter-spacing:.06em;display:inline-block;padding:5px 11px;border:1px solid rgba(95,156,201,.18);border-radius:20px;background:rgba(128,189,238,.18);margin-left:8px}
.timeline{display:flex;align-items:center;gap:12px;min-width:525px;padding:13px 16px;background:linear-gradient(110deg,#25475e,#1c3e59 65%,#2f5173);color:#e8f6ff;border-radius:24px;box-shadow:0 18px 35px rgba(31,69,99,.2),inset 0 1px 1px rgba(255,255,255,.27)}.circle-play{border:1px solid rgba(255,255,255,.38);color:white;flex:0 0 43px;width:43px;height:43px;background:linear-gradient(145deg,#629bbf,#466d8d);box-shadow:0 5px 14px rgba(7,28,48,.22),inset 0 1px 2px rgba(255,255,255,.28);border-radius:50%;font-size:16px}.circle-pause{flex:0 0 auto;background:transparent;border:0;color:#d4e4f3;padding:8px;font-size:17px}.modes{display:flex;gap:3px;padding:4px;border-radius:99px;background:rgba(255,255,255,.09)}.modes button{background:transparent;border:0;border-radius:20px;font-size:10px;color:#cee1f1;padding:8px 9px}.modes button.active{background:rgba(160,211,248,.34);color:white}.timeline-meta{border-left:1px solid rgba(255,255,255,.17);padding-left:15px;flex:1;min-width:100px}.timeline-meta span{display:block;font-size:12px;margin-bottom:5px;white-space:nowrap}.track{height:5px;border-radius:99px;background:rgba(211,229,249,.2);overflow:hidden}.track>div{height:100%;border-radius:99px;background:linear-gradient(90deg,#99d4f6,#dbbaf9)}.timeline-icon{font-size:20px;opacity:.85}
.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(120px,.7fr) minmax(120px,.7fr);gap:9px;align-items:end;margin-left:103px}.tab{border:1px solid rgba(255,255,255,.58);border-bottom:none;min-height:88px;text-align:left;padding:20px 20px 14px;border-radius:31px 31px 0 0;background:rgba(233,243,255,.62);color:#3f7098;display:flex;flex-direction:column;justify-content:center;gap:5px;transition:background .18s,transform .18s}.tab strong{font-size:21px;font-weight:450;letter-spacing:-.025em}.tab small{font-size:11px;line-height:1.3}.tab.active{min-height:100px;background:linear-gradient(130deg,#b6d9f5,#c2d7fa 75%,#e5dbf7);box-shadow:inset 0 1px 1px rgba(255,255,255,.9);color:#28628d}.tab.active strong{font-weight:550}.tab:hover{background:#d7e8f9}.tab-mini strong{font-size:16px}.tab-mini{background:rgba(235,243,255,.5)}
.workspace{display:grid;grid-template-columns:88px minmax(0,1fr);gap:18px;margin-top:-1px;position:relative}.subnav{padding:19px 11px;background:rgba(242,249,255,.47);border-radius:42px;border:1px solid rgba(255,255,255,.75);box-shadow:var(--shadow);display:flex;flex-direction:column;gap:7px;align-self:stretch;min-height:590px}.subnav button{border:0;border-radius:25px;padding:16px 3px;background:transparent;color:#4c769b;font-size:11px;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;transition:.18s}.subnav button.active{background:linear-gradient(145deg,#b6daf9,#cfe5ff);color:#275e8b;box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 20px rgba(63,131,191,.12)}.subnav button .nav-ico{font-size:20px;line-height:1}.subnav button:hover{background:rgba(167,204,234,.37)}.surface{min-width:0;min-height:590px;padding:17px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.74);border-radius:36px;background:linear-gradient(130deg,rgba(174,212,245,.56),rgba(206,224,250,.62) 63%,rgba(224,208,244,.5));box-shadow:var(--shadow)}.surface:before{content:"";pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse 30% 45% at 20% 8%,rgba(255,255,255,.32),transparent 80%),radial-gradient(ellipse 35% 40% at 90% 78%,rgba(245,217,245,.32),transparent 75%)}.surface>*{position:relative}.surface-title{display:flex;align-items:center;justify-content:space-between;margin:2px 4px 15px;gap:12px}.surface-title h2{margin:0}.surface-title .overline{font-size:11px;color:#5682a9}.contents{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:16px}.glass-card{background:linear-gradient(140deg,rgba(245,251,255,.57),rgba(232,245,255,.33) 60%,rgba(253,240,255,.40));border:1px solid rgba(255,255,255,.82);box-shadow:0 12px 32px rgba(67,112,156,.10),inset 0 1px 1px rgba(255,255,255,.98);border-radius:31px}.sim-card{min-width:0;padding:20px 18px 17px;display:flex;flex-direction:column}.petri{height:405px;position:relative;border:1px solid rgba(255,255,255,.46);border-radius:50%/42%;overflow:hidden;background:radial-gradient(ellipse at 50% 50%,rgba(160,207,240,.22),rgba(111,179,222,.08) 58%,rgba(233,246,255,.14));box-shadow:inset 0 14px 32px rgba(100,159,207,.09),inset 0 -1px 2px rgba(255,255,255,.9)}.petri:after{content:"";pointer-events:none;position:absolute;inset:5%;border:1px solid rgba(255,255,255,.27);border-radius:50%/40%}.bubble{position:absolute;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.57);border-radius:50%;box-shadow:inset 0 3px 15px rgba(255,255,255,.23),0 3px 35px rgba(141,184,225,.11);animation:breath 9s ease-in-out infinite alternate}.bubble[data-group="0"]{background:radial-gradient(ellipse,rgba(138,200,245,.25),rgba(168,224,242,.14))}.bubble[data-group="1"]{background:radial-gradient(ellipse,rgba(188,172,241,.26),rgba(184,215,243,.11))}.bubble[data-group="2"]{background:radial-gradient(ellipse,rgba(141,231,218,.21),rgba(165,218,240,.12))}.bubble[data-group="3"]{background:radial-gradient(ellipse,rgba(244,183,218,.21),rgba(174,209,250,.12))}.dot{--dx:0px;--dy:0px;position:absolute;transform:translate(-50%,-50%);padding:0;border:1px solid rgba(255,255,255,.95);border-radius:50%;width:9px;height:9px;background:rgba(255,255,255,.98);box-shadow:0 0 10px 3px rgba(255,255,255,.53),0 1px 7px rgba(85,154,214,.35);transition:left .95s ease,top .95s ease}.dot:hover{transform:translate(-50%,-50%) scale(1.7);z-index:10;background:#e9f7ff}.dot.player{width:15px;height:15px;background:#a0dbff;box-shadow:0 0 0 4px rgba(255,255,255,.65),0 0 16px 7px rgba(73,178,237,.55);z-index:4}.bubble-name{font-size:9px;position:absolute;bottom:14px;left:15px;color:rgba(48,105,148,.6);pointer-events:none}.petri-empty{display:grid;place-items:center;height:100%;color:var(--ink-muted)}@keyframes breath{to{filter:brightness(1.035);transform:translate(-50%,-50%) scale(1.025)}}.legend{display:flex;align-items:center;gap:10px;font-size:11px;color:#567e9d;margin:14px 8px 4px}.legend .small-dot{display:inline-block;width:8px;height:8px;border-radius:100%;background:#fff;box-shadow:0 0 9px rgba(93,170,210,.85)}.legend .you-dot{background:#8bd1fb}.legend .divide{flex:1}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-top:12px}.metric{padding:16px 15px;border-radius:23px;background:rgba(245,250,255,.57);border:1px solid rgba(255,255,255,.75)}.metric .big{display:block;font-size:25px;font-weight:450;letter-spacing:-.04em;color:#23537a}.metric .unit{font-size:13px;color:#68849c}.metric .cap{display:block;font-size:11px;color:#6688a5;margin-top:3px}.controls-card{padding:23px 21px;max-height:630px;overflow-y:auto;min-width:0;scrollbar-color:rgba(120,160,191,.3) transparent}.control-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.control-head h2{font-size:20px;margin:0}.more{border:0;background:none;font-size:22px;color:var(--ink-muted)}.control-break{height:1px;background:rgba(95,141,175,.17);margin:18px 0}.switch-row{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;font-weight:550}.switch{width:49px;height:28px;border:1px solid rgba(84,143,183,.15);border-radius:99px;background:rgba(99,145,188,.25);padding:3px;transition:background .2s}.switch:after{content:"";display:block;width:21px;height:21px;border-radius:50%;background:#f8fcff;box-shadow:0 2px 7px rgba(51,79,109,.18);transition:transform .2s}.switch.on{background:#73b7e8}.switch.on:after{transform:translateX(19px)}.control-line{padding:10px 0 12px}.control-line-top{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:12px}.control-line-top label{line-height:1.2}.control-value{color:#46749c;font-size:11px;padding:4px 8px;background:rgba(255,255,255,.43);border-radius:99px}.slider{width:100%;height:5px;appearance:none;-webkit-appearance:none;border-radius:99px;margin:12px 0 5px;background:linear-gradient(90deg,#8bbfea,#d4ccf6)}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:19px;height:19px;border-radius:50%;border:1px solid #fff;background:#f3f9ff;box-shadow:0 3px 7px rgba(56,96,141,.25)}.slider::-moz-range-thumb{width:18px;height:18px;border:1px solid white;border-radius:50%;background:#f3f9ff}.control-ends{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#8ba2b7}.control-ends span:last-child{text-align:right}.helper{color:#7190aa;font-size:11px;line-height:1.4;margin-top:8px}.badge{display:inline-block;padding:7px 11px;border-radius:100px;font-size:11px;background:rgba(255,255,255,.44);border:1px solid rgba(255,255,255,.64);color:#4e789b}.warning{border-radius:15px;padding:11px 13px;background:rgba(255,243,224,.8);color:#745e41;border:1px solid #fff0d3;font-size:12px;margin-bottom:14px}.notice{background:rgba(242,250,255,.65);border:1px solid rgba(255,255,255,.8);padding:12px 15px;border-radius:17px;font-size:12px;color:#527b9c;margin:10px 0 16px}.primary,.secondary,.danger{border:1px solid #b1d6ee;border-radius:99px;background:linear-gradient(145deg,#8ec2eb,#b6d7f3);color:#1c4c75;padding:11px 17px;font-size:12px;font-weight:600;box-shadow:inset 0 1px 0 rgba(255,255,255,.65)}.secondary{background:rgba(255,255,255,.45);color:#386f9a;border-color:rgba(255,255,255,.75)}.danger{background:rgba(255,224,232,.7);color:#90485e;border-color:#ffdae0}.button-row{display:flex;gap:9px;flex-wrap:wrap}.section{padding:20px}.data-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:11px}.person-card{border:1px solid rgba(255,255,255,.8);border-radius:21px;background:rgba(249,252,255,.52);padding:14px;text-align:left;color:#285576;display:grid;gap:10px}.person-card:hover{background:rgba(255,255,255,.8)}.person-card .person-top{display:flex;gap:8px;justify-content:space-between;align-items:center}.person-card .av{height:33px;width:33px;border-radius:50%;background:#cde7f9;display:grid;place-items:center;font-size:13px}.person-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;font-size:11px;color:#5b83a1}.person-stats strong{color:#275578;font-size:12px}.chart-panel{padding:18px;min-height:300px}.chart-svg{width:100%;height:auto;max-height:280px;overflow:visible}.stats-table{width:100%;border-collapse:collapse;font-size:12px}.stats-table th,.stats-table td{text-align:left;padding:10px 8px;border-bottom:1px solid rgba(96,146,177,.16)}.stats-table th{color:#557b9b;font-weight:650}.all-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.all-card{padding:21px}.all-card h3{font-size:18px}.rule-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.rule-card{padding:18px;display:grid;gap:10px}.rule-card h3{margin:0}.rule-card p{font-size:12px;color:#587b99;margin:0}.rule-card select,.rule-card textarea{background:rgba(255,255,255,.65);border-radius:12px;padding:9px;border:1px solid rgba(99,141,173,.18);color:#345f7f;width:100%}.rule-card textarea{resize:vertical;min-height:55px}.rule-card .rule-meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.rule-card .rule-meta small{font-size:10px;color:#6a93b3}.account-layout{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;max-width:1300px;padding:40px;margin:0 auto}.account-art{padding:55px}.account-art img{max-width:270px}.account-art h1{font-size:clamp(34px,5vw,66px);margin:50px 0 18px}.account-art p{max-width:470px;font-size:17px;color:#5b81a3}.account-blob{width:85%;aspect-ratio:1.8;margin-top:45px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:radial-gradient(ellipse at 35% 35%,rgba(255,255,255,.8),rgba(160,207,240,.26) 50%,rgba(223,203,242,.23));box-shadow:inset 0 10px 40px rgba(255,255,255,.6),0 22px 42px rgba(90,149,182,.13);position:relative;display:flex;align-items:center;justify-content:center;gap:15px}.account-blob i{display:block;width:8px;height:8px;border-radius:100%;background:#fff;box-shadow:0 0 8px white}.login-card{padding:40px;max-width:460px;width:100%;justify-self:center}.login-card h2{font-size:26px}.field{display:grid;gap:6px;margin:13px 0}.field label{font-size:12px;color:#537e9e}.field input,.field textarea,.field select{width:100%;padding:13px 14px;border:1px solid rgba(116,160,197,.22);background:rgba(255,255,255,.68);border-radius:14px;color:#285676}.field input::placeholder{color:#9db4c6}.login-card .primary{width:100%;margin-top:14px;font-size:14px;padding:15px}.link-btn{border:0;background:none;color:#3c789e;text-decoration:underline;padding:6px 0;font-size:12px}.footnote{font-size:11px;color:#8ca8bc;margin:18px 0 0}.modal-layer{position:fixed;inset:0;background:rgba(20,44,65,.28);display:grid;place-items:center;z-index:50;padding:18px;backdrop-filter:blur(9px)}.modal{width:min(580px,100%);max-height:88vh;overflow-y:auto;padding:31px;background:linear-gradient(155deg,#f1f8ff,#e9f1fb 65%,#eee9f7);border-radius:30px;border:1px solid white;box-shadow:0 30px 90px rgba(19,56,91,.25)}.modal h2{font-size:26px}.modal p{font-size:14px;color:#5b7d96}.modal .button-row{margin-top:22px}.toast{position:fixed;bottom:25px;right:25px;z-index:70;padding:16px 20px;border-radius:18px;color:#163d5e;background:#eff7ff;border:1px solid #fff;box-shadow:0 10px 30px rgba(33,83,117,.22);max-width:360px;font-size:13px}.toast.error{background:#fff1f3;color:#9d4153}.loading{opacity:.6;pointer-events:none}.tiny-chart{height:96px;width:100%}.compare-timeline{display:flex;flex-direction:column;gap:8px;margin:15px 0}.select-year{width:180px;border-radius:99px;border:1px solid white;padding:8px 10px;color:#416d90;background:rgba(255,255,255,.6)}.rule-filters{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 20px}.rule-filters button{border:1px solid white;background:rgba(255,255,255,.45);border-radius:99px;padding:8px 12px;color:#577b9a;font-size:11px}.rule-filters button.active{background:#afd4ef;color:#25577f}.progress-rule{height:7px;background:rgba(137,176,207,.2);border-radius:99px;overflow:hidden}.progress-rule div{height:100%;background:#88bde2;transition:width .3s}.account-menu{position:absolute;right:26px;top:78px;background:#eff6fe;border:1px solid white;padding:12px;border-radius:20px;z-index:25;box-shadow:var(--shadow);display:grid;gap:6px;min-width:180px}.account-menu button{background:transparent;border:0;padding:10px;text-align:left;color:#3e6e91;border-radius:10px}.account-menu button:hover{background:#daeefa}.detail-name{font-size:28px;letter-spacing:-.035em}.details-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:16px 0}.detail-metric{border:1px solid white;background:rgba(255,255,255,.49);padding:12px;border-radius:16px}.detail-metric strong{display:block;font-size:19px;font-weight:550}.detail-metric small{font-size:11px;color:#7893a9}.dual-content{display:grid;grid-template-columns:1fr 1fr;gap:14px}.empty{padding:35px;text-align:center;color:#6789a5}.user-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:12px 0;border-bottom:1px solid rgba(100,147,185,.15)}.user-row .button-row button{padding:8px 11px}.stage-caption{display:flex;align-items:center;justify-content:space-between;gap:10px}.meter{height:5px;border-radius:50px;background:#dce9f4;overflow:hidden}.meter span{display:block;background:linear-gradient(90deg,#93cbee,#d6bcec);height:100%;border-radius:50px}.report-summary{font-size:12px;line-height:1.65;color:#537894}
@media(max-width:1150px){.masthead{align-items:flex-start;flex-direction:column}.timeline{width:100%;min-width:0}.contents{grid-template-columns:minmax(0,1fr) 295px}.tabs{margin-left:0}.tab{min-height:75px}.petri{height:340px}}
@media(max-width:900px){.contents{grid-template-columns:1fr}.controls-card{max-height:none}.workspace{grid-template-columns:70px minmax(0,1fr);gap:10px}.subnav{padding:12px 6px;min-height:400px}.subnav button{font-size:9px}.all-grid{grid-template-columns:1fr}.tabs{grid-template-columns:repeat(3,1fr);gap:6px}.tab-mini{grid-column:span 1}.tab{min-height:72px;padding:13px 11px}.tab strong{font-size:16px}.tab small{font-size:9px}.petri{height:320px}}
@media(max-width:650px){.app-shell{padding:14px 10px 30px}.topbar{align-items:flex-start}.logo{width:145px}.top-actions{gap:4px}.status-pill{font-size:10px;padding:8px}.account-pill{padding:9px;font-size:10px}.top-round{display:none}.masthead{margin:25px 5px 18px;gap:17px}.masthead h1{font-size:30px}.masthead p{font-size:12px}.timeline{padding:8px;gap:5px;border-radius:18px;flex-wrap:wrap}.circle-play{width:37px;height:37px;flex-basis:37px}.modes button{padding:6px;font-size:9px}.timeline-meta{flex:1;min-width:75px;padding-left:8px}.timeline-meta span{font-size:10px}.timeline-icon{display:none}.tabs{margin:0 4px}.tab{padding:10px 7px;min-height:68px;border-radius:17px 17px 0 0}.tab strong{font-size:12px}.tab small{display:none}.tab-mini strong{font-size:10px}.workspace{grid-template-columns:1fr}.subnav{grid-row:1;display:flex;flex-direction:row;gap:1px;min-height:0;padding:4px;border-radius:20px;overflow-x:auto}.subnav button{min-width:65px;padding:8px 3px;min-height:58px;font-size:9px;flex-shrink:0}.subnav button .nav-ico{font-size:16px}.surface{border-radius:25px;padding:10px;min-height:480px}.surface-title{margin:8px}.sim-card{padding:10px}.petri{height:265px}.metrics{gap:5px}.metric{padding:10px 7px;border-radius:15px}.metric .big{font-size:20px}.metric .cap{font-size:9px}.controls-card{padding:18px}.account-layout{grid-template-columns:1fr;gap:10px;padding:30px 16px}.account-art{padding:5px}.account-art img{max-width:170px}.account-art h1{font-size:33px;margin:16px 0}.account-art p{font-size:13px}.account-blob{display:none}.login-card{padding:25px}.dual-content{grid-template-columns:1fr}.all-grid{grid-template-columns:1fr}.rule-grid{grid-template-columns:1fr}.modal{padding:22px}.detail-name{font-size:23px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* V0.3 final UX wireframe refinement: global timebar + Dorf tabs + separate
   PARAMETER and FIGUR panels. Not a literal copy of user-supplied colors. */
.no-subnav{grid-template-columns:minmax(0,1fr)}
.control-panels{display:flex;flex-direction:column;gap:15px;min-width:0}
.control-panels .controls-card{max-height:none;overflow:visible}
.control-panels .controls-card .button-row{margin-top:12px}
.control-panels .controls-card .helper{margin:14px 0;font-size:11px}
.petri{min-height:350px}
.person-stats{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;color:#537c99;font-size:12px}
.person-stats strong{color:#244e70;font-size:13px}
.report-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin:16px 0}
.compare-timeline{display:flex;align-items:center;gap:18px;margin:20px 0}
.compare-timeline label{min-width:190px;font-size:13px}
.compare-timeline .slider{flex:1}
.chart-svg{width:100%;height:auto;display:block;margin-top:10px}
.stats-table{overflow-x:auto;margin-top:12px}
.stats-table table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}
.stats-table td,.stats-table th{padding:10px;border-bottom:1px solid rgba(89,139,177,.15)}
.all-card{border:1px solid white;text-align:left;color:var(--ink);cursor:pointer}
.all-card h3{margin:10px 0 3px}
.all-card .metrics{gap:4px}
.all-card .metric{padding:10px 8px;border-radius:14px}
.all-card .big{font-size:18px}
.dual-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.rule-grid{grid-template-columns:repeat(auto-fill,minmax(265px,1fr))}
.rule-filters{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0}
.rule-filters button{background:rgba(240,249,255,.6);border:1px solid rgba(94,149,190,.18);border-radius:99px;padding:7px 12px;color:var(--ink)}
.rule-filters button.active{background:#bddbf5}
.detail-name{font-size:27px}
.details-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.detail-metric{background:#e0eff9;border:1px solid #fff;border-radius:16px;padding:13px;display:grid;gap:7px}
.detail-metric strong{font-size:19px;color:var(--ink)}
.detail-metric small{font-size:10px;color:var(--ink-muted)}
.warning{background:#fff6e9;border:1px solid #f2d3a6;padding:13px;border-radius:15px;font-size:12px;margin:14px 0}
.warning p{margin:6px 0;font-size:12px}
.warning button{font-size:11px}
@media(max-width:1120px){.contents{grid-template-columns:minmax(0,1fr) 270px}.timeline{min-width:450px}.modes button{padding:6px}}
@media(max-width:920px){.masthead{align-items:stretch;flex-direction:column}.timeline{width:100%;min-width:0}.tabs{margin-left:0}.workspace{grid-template-columns:75px minmax(0,1fr)}.contents{grid-template-columns:minmax(0,1fr)}.control-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.petri{min-height:320px;height:340px}.report-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.tab{border-radius:18px 18px 0 0;min-height:76px;padding:14px 8px}.tab.active{min-height:82px}.tab strong{font-size:13px}.tab small{font-size:9px}.tab-mini{min-height:54px}.tab-mini strong{font-size:12px}.workspace{grid-template-columns:minmax(0,1fr)}.subnav{min-height:auto;border-radius:22px;flex-direction:row;justify-content:space-around;padding:5px 4px;overflow-x:auto}.subnav button{min-height:50px;min-width:67px;font-size:9px}.subnav button .nav-ico{font-size:14px}.surface{min-height:0;padding:9px;border-radius:24px}.sim-card{padding:10px}.petri{height:285px;min-height:285px}.control-panels{grid-template-columns:minmax(0,1fr)}.metrics{gap:5px}.metric{padding:10px 8px;border-radius:15px}.metric .big{font-size:20px}.metric .cap{font-size:9px}.dual-content,.report-summary{grid-template-columns:minmax(0,1fr)}.timeline{flex-wrap:wrap;gap:7px;padding:11px}.timeline-meta{min-width:130px}.account-pill{padding:9px}.top-actions{flex-wrap:wrap;justify-content:flex-end}.logo{max-width:160px}.detail-metric{padding:9px}.details-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Avoid stretching the simulation visualization to the full height of the
   longer controls column; both columns scroll naturally instead. */
.contents{align-items:start}
.sim-card{align-self:start}

/* V0.3 alpha.2: two audiences, one model / two information depths. */
.topbar{gap:15px;flex-wrap:wrap}.ux-mode-select{display:flex;align-items:center;gap:12px;margin:auto;min-width:0}.ux-mode-label{font-size:10px;color:#6484a1;text-transform:uppercase;letter-spacing:.045em;white-space:nowrap}.ux-mode-buttons{display:flex;gap:5px;padding:5px;border-radius:100px;border:1px solid #fff;background:rgba(234,246,255,.75);box-shadow:0 5px 17px rgba(70,130,177,.10)}.ux-mode-buttons button{display:flex;flex-direction:column;justify-content:center;text-align:center;min-width:128px;gap:3px;border:1px solid transparent;padding:9px 15px;border-radius:100px;background:transparent;color:#577b99}.ux-mode-buttons button span{font-size:13px;font-weight:650}.ux-mode-buttons button small{font-size:10px;opacity:.85}.ux-mode-buttons button.selected{border-color:#fff;background:linear-gradient(125deg,#b0d7f7,#dbe9fd 72%,#eee0fa);box-shadow:0 3px 13px rgba(60,124,186,.15);color:#255b84}.ux-intro{display:flex;align-items:center;flex-wrap:wrap;gap:9px 14px;min-height:48px;padding:11px 20px;margin:0 0 17px 103px;border-radius:18px;border:1px solid rgba(255,255,255,.7);background:rgba(248,252,255,.5);color:#4c7391;font-size:12px}.ux-intro .ux-intro-title{font-weight:700;color:#285d83}.ux-intro button{margin-left:auto;white-space:nowrap;border:0;background:transparent;color:#286e9b;text-decoration:underline;font-weight:600;font-size:11px}.ux-intro.research{background:rgba(228,226,251,.43)}.control-explain{font-size:11px;line-height:1.5;color:#5e7f9a;margin:4px 0 11px}.control-help{margin:4px 0 10px;font-size:11px;color:#6886a1}.control-help summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}.control-help p{margin:7px 0;color:#557b97;line-height:1.4}.mode-footnote{font-size:11px;line-height:1.6;background:rgba(243,249,254,.56);border-radius:13px;padding:12px;color:#557b98;margin:11px 0}.mode-footnote .link-btn{display:block;text-align:left;margin-top:7px}.study-meta{padding:19px 20px;font-size:12px}.study-meta h3{margin:10px 0 11px}.study-meta dl{display:grid;gap:6px;margin:0 0 12px}.study-meta dl div{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;border-bottom:1px solid rgba(114,161,190,.16);padding:6px 0}.study-meta dt{color:#6688a1}.study-meta dd{margin:0;font-family:ui-monospace,monospace;color:#285d87;font-size:11px;overflow-wrap:anywhere;text-align:right}.study-meta p{font-size:11px;color:#587e9b}.study-meta .button-row{display:flex;flex-wrap:wrap;gap:8px}.petri .dot{width:11px;height:11px;border:1px solid rgba(59,128,177,.55);background:#f9fdff;box-shadow:0 0 0 2px rgba(56,141,196,.2),0 0 7px rgba(47,124,183,.35)}.petri .dot.player{width:16px;height:16px;background:#a3d9fa;border:2px solid #fff;box-shadow:0 0 0 4px rgba(54,129,190,.35),0 0 14px rgba(42,129,192,.42)}
@media(max-width:1260px){.topbar{justify-content:space-between}.ux-mode-select{order:3;flex-basis:100%;justify-content:center}.ux-intro{margin-left:0}}
@media(max-width:650px){.ux-mode-select{gap:7px;align-items:stretch}.ux-mode-label{display:none}.ux-mode-buttons{width:100%}.ux-mode-buttons button{flex:1;min-width:0}.ux-mode-buttons button span{font-size:12px}.ux-mode-buttons button small{font-size:9px}.ux-intro{align-items:flex-start;margin:0 4px 13px}.ux-intro button{margin-left:0}.study-meta{padding:14px}}

/* ========================================================================
   V0.3 ALPHA 3 — visible review of user's structural UX sketches.
   IMPORTANT: graphical refinement; no changes to scientific model rules.
   ======================================================================== */
:root{
  --ink:#163851; --ink-muted:#52738f; --shadow:0 13px 35px rgba(48,92,132,.10);
}
body{
  background:radial-gradient(ellipse 66% 52% at 1% 5%,#f8fcff 0,transparent 75%),
             radial-gradient(ellipse 50% 55% at 96% 98%,rgba(215,197,240,.56),transparent 77%),
             linear-gradient(130deg,#e6f1fc 5%,#edf5fd 48%,#dce9f9 100%);
}
.app-shell{max-width:1600px;padding-top:20px}
.alpha-ribbon{display:inline-flex;align-items:center;gap:9px;font-size:10px;font-weight:750;letter-spacing:.10em;color:#295c82;background:#d2e8fb;border:1px solid #fff;padding:7px 12px;border-radius:100px;margin:0 0 12px;box-shadow:0 3px 12px rgba(42,108,162,.09)}
.alpha-ribbon span{font-weight:500;color:#5d7991}
.topbar{min-height:76px;padding:0 4px 0 0;gap:19px}
.logo{width:205px}
.status-pill,.account-pill{border:1px solid rgba(255,255,255,.86);padding:14px 20px;background:#d1e6fb;color:#265575;font-weight:550;box-shadow:0 5px 16px rgba(55,101,150,.08)}
.account-pill{background:#badbf6}
.ux-mode-select{padding:6px 10px 6px 13px;border:1px solid rgba(255,255,255,.88);background:rgba(250,252,255,.64);border-radius:100px;gap:14px;box-shadow:0 7px 22px rgba(57,97,149,.07)}
.ux-mode-label{font-size:10px;font-weight:700;color:#39688d;letter-spacing:.07em}
.ux-mode-buttons{padding:3px;background:#d6e5f3;gap:3px;box-shadow:none}
.ux-mode-buttons button{min-width:132px;padding:11px 17px;font-weight:550;color:#426481}
.ux-mode-buttons button.selected{background:linear-gradient(125deg,#95c9ee,#b9d8f5 75%,#e2d4f4);box-shadow:0 4px 12px rgba(38,110,180,.18);color:#174b70}
.masthead{margin:29px 0 26px;align-items:center}
.masthead h1{font-size:clamp(30px,3.1vw,47px);font-weight:470;color:#315f84;letter-spacing:-.045em}
.masthead p{font-size:14px;color:#5e839f}
.version{background:rgba(131,189,233,.26);border-color:rgba(255,255,255,.75);color:#2c6996;font-weight:700}
.timeline{padding:14px 18px;border-radius:25px;background:linear-gradient(112deg,#2a516d 0%,#19384f 55%,#234f69 100%);box-shadow:0 12px 28px rgba(27,65,105,.14);max-width:700px}
.timeline .track{background:rgba(223,238,252,.24)}
.ux-intro{margin-left:0;margin-bottom:18px;border-radius:21px;background:rgba(251,253,255,.66);border-color:rgba(255,255,255,.93);padding:12px 17px;line-height:1.4;color:#4c7294}
.ux-intro .ux-intro-title{font-weight:750}
.tabs{margin-left:0;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(142px,.72fr) minmax(140px,.72fr)}
.tab{padding:23px 23px 16px;min-height:112px;border-radius:36px 36px 0 0;border:1px solid rgba(255,255,255,.65);border-bottom:0;background:rgba(213,228,251,.72);box-shadow:inset 0 1px 2px #fff;color:#376e97}
.tab strong{font-size:23px;font-weight:480}
.tab small{font-size:12px;color:#5b819b}
.tab.active{background:linear-gradient(140deg,#b8d4fc,#d0dcfc 76%,#e5daf6);min-height:123px;color:#255d8a;box-shadow:inset 0 1px 1px white}
.tab.active strong{font-weight:620}
.tab-mini{min-height:91px;border-radius:35px 35px 0 0;background:rgba(225,233,249,.74)}
.tab-mini strong{font-size:17px}
.workspace{position:relative;display:grid;grid-template-columns:115px minmax(0,1fr);align-items:stretch;gap:21px;margin-top:-1px;border:1px solid rgba(255,255,255,.7);border-radius:0 0 36px 36px;background:linear-gradient(125deg,rgba(190,216,252,.64),rgba(205,219,250,.70) 72%,rgba(222,208,246,.5));padding:28px 27px 28px 27px;min-height:660px;box-shadow:0 22px 43px rgba(40,84,140,.09)}
.workspace.no-subnav{grid-template-columns:minmax(0,1fr)}
.subnav{padding:0;min-height:570px;border:none;box-shadow:none;background:transparent;border-radius:0;display:flex;flex-direction:column;gap:16px;align-items:stretch}
.subnav-top{display:flex;justify-content:center}
.subnav-stack{display:flex;flex-direction:column;gap:4px;flex:1;align-items:stretch;background:rgba(247,251,255,.63);border:1px solid rgba(255,255,255,.75);border-radius:45px;padding:12px 7px;min-height:385px}
.subnav button{color:#416c8d;font-size:12px;padding:13px 7px;min-height:76px;border-radius:25px}
.subnav-top button{border-radius:45px;width:93px;min-height:93px;background:#b4dafa;border:1px solid white;font-weight:650;box-shadow:0 9px 19px rgba(81,139,182,.12)}
.subnav button.active{background:linear-gradient(146deg,#89c6ef,#b5dafa);color:#18476a;border:1px solid white;box-shadow:0 8px 17px rgba(74,131,181,.13)}
.subnav .nav-ico{font-size:20px}
.surface{padding:16px;min-height:610px;border-radius:29px;background:linear-gradient(128deg,rgba(180,216,247,.83) 0%,rgba(199,219,249,.72) 63%,rgba(213,207,244,.5));border:1px solid rgba(255,255,255,.5);box-shadow:none;overflow:visible}
.surface:before{border-radius:inherit}
.surface-title{margin:4px 8px 17px}
.surface-title h2{font-weight:540;font-size:22px;color:#275e84}
.contents{grid-template-columns:minmax(0,1fr) minmax(280px,330px);gap:17px;align-items:start}
.glass-card{border:1px solid rgba(255,255,255,.83);background:linear-gradient(142deg,rgba(252,253,255,.79),rgba(236,247,255,.71) 65%,rgba(248,235,250,.55));border-radius:29px;box-shadow:0 9px 23px rgba(62,110,153,.09),inset 0 1px 2px white}
.sim-card{padding:17px 18px 20px;gap:0;min-height:0}
.sim-topline{display:flex;align-items:center;justify-content:space-between;padding:4px 9px 16px;gap:12px}
.sim-topline h3{font-weight:540;margin:3px 0 0;font-size:24px;letter-spacing:-.03em;color:#265a80}
.sim-topline .overline{font-size:10px;font-weight:720;letter-spacing:.06em;color:#5986a9}
.petri-population{display:flex;align-items:center;gap:5px;color:#235778;font-size:22px;font-weight:620;white-space:nowrap}
.petri-population small{font-size:12px;font-weight:450;color:#6789a0}
/* The old nearly-white cells were invisible on a nearly-white dish.
   Alpha 3 introduces a tonal foundation + four visible, colored social bubbles. */
.petri{
  height:416px;min-height:416px;isolation:isolate;position:relative;overflow:hidden;
  border-radius:48% / 43%;border:2px solid rgba(255,255,255,.95);
  background:radial-gradient(ellipse at 43% 25%,rgba(247,252,255,.91),transparent 62%),
             radial-gradient(ellipse at 48% 65%,rgba(158,196,231,.4),transparent 82%),
             linear-gradient(145deg,#d4e9fa,#b7d5ec 55%,#d0d6ee 100%);
  box-shadow:inset 0 22px 42px rgba(47,105,154,.15),inset 0 -5px 18px rgba(255,255,255,.70),0 7px 18px rgba(75,128,173,.11);
}
.petri:after{inset:3%;border:1px solid rgba(255,255,255,.63);border-radius:49% / 41%}
.petri-glass{position:absolute;inset:6% 5%;z-index:-1;pointer-events:none;border-radius:48% / 44%;background:radial-gradient(ellipse at 40% 27%,rgba(255,255,255,.44),transparent 65%);box-shadow:inset 0 8px 30px rgba(82,135,178,.1)}
.petri .bubble{z-index:1;border:1.5px solid rgba(255,255,255,.82);border-radius:48% 52% 55% 45% / 55% 46% 54% 45%;transform:translate(-50%,-50%);animation:breath 10s ease-in-out infinite alternate;box-shadow:inset 0 6px 23px rgba(255,255,255,.22),0 7px 17px rgba(55,114,166,.14)}
.petri .bubble[data-group="0"]{background:radial-gradient(ellipse at 39% 40%,rgba(108,189,239,.41),rgba(118,187,230,.30) 75%)}
.petri .bubble[data-group="1"]{background:radial-gradient(ellipse at 39% 40%,rgba(172,151,228,.38),rgba(190,178,231,.28) 75%)}
.petri .bubble[data-group="2"]{background:radial-gradient(ellipse at 39% 40%,rgba(113,205,199,.34),rgba(136,216,210,.23) 75%)}
.petri .bubble[data-group="3"]{background:radial-gradient(ellipse at 39% 40%,rgba(241,172,199,.34),rgba(239,188,214,.23) 75%)}
.petri .bubble-label{position:absolute;top:9%;left:50%;transform:translateX(-50%);pointer-events:none;white-space:nowrap;display:flex;align-items:center;gap:5px;z-index:1;color:#325f80;font-size:9px;letter-spacing:.055em;text-transform:uppercase;background:rgba(244,250,255,.7);border:1px solid rgba(255,255,255,.7);border-radius:20px;padding:4px 7px;box-shadow:0 2px 8px rgba(42,103,158,.05)}
.petri .bubble-label strong{font-size:9px;font-weight:650;letter-spacing:0;text-transform:none}
.petri .dot{z-index:4;width:13px;height:13px;display:block;border:2px solid #508cbb;background:#f9fdff;box-shadow:0 0 0 2px rgba(255,255,255,.53),0 3px 6px rgba(44,93,141,.35),inset 0 1px 2px #fff;transform:translate(-50%,-50%);transition:left .9s ease,top .9s ease,box-shadow .2s ease}
.petri .dot[data-group="1"]{border-color:#847db8}
.petri .dot[data-group="2"]{border-color:#468e9b}
.petri .dot[data-group="3"]{border-color:#b477a3}
.petri .dot:focus-visible,.petri .dot:hover{transform:translate(-50%,-50%) scale(1.6);z-index:8;background:#fff;box-shadow:0 0 0 4px rgba(235,246,255,.9),0 4px 12px rgba(28,85,131,.34)}
.petri .dot.player{z-index:9;width:19px;height:19px;background:#459fdb;border:3px solid white;box-shadow:0 0 0 5px rgba(39,107,168,.43),0 4px 12px rgba(17,62,111,.32)}
.petri-outsiders{position:absolute;bottom:8%;left:36%;z-index:2;background:rgba(255,255,255,.85);padding:4px 8px;border-radius:99px;color:#476b88;font-size:10px}
.legend{font-size:12px;color:#4c7692;flex-wrap:wrap}
.legend .small-dot{background:#fbfdff;border:1px solid #578fb8;box-shadow:0 2px 5px rgba(40,93,141,.15);width:10px;height:10px}
.legend .you-dot{background:#459fdb;border-color:white;box-shadow:0 0 0 2px rgba(64,131,187,.35)}
.metric{background:rgba(255,255,255,.74);border-color:white;padding:18px 17px;border-radius:22px}
.metric .big{font-size:31px;font-weight:540;color:#1c4b6d}
.metric .cap{font-size:12px;color:#56758e}
.control-panels{gap:15px}
.controls-card{padding:23px 22px}
.control-head h2{font-size:24px;letter-spacing:-.027em;color:#27668d;font-weight:520;margin-top:5px}
.micro{font-size:10px;font-weight:650;color:#668ba5;letter-spacing:.07em}
.control-line-top{font-size:13px;font-weight:560;color:#285f83}
.control-explain{font-size:12px;line-height:1.48;color:#567a95;margin-top:7px;margin-bottom:7px}
.control-ends{font-size:11px;color:#658aa6}
.control-value{background:rgba(197,224,244,.56);font-size:12px;font-weight:650;color:#275c87}
.slider{height:7px;margin:14px 0 7px;background:linear-gradient(90deg,#8ec7ea,#a5c7ec 68%,#d8b3e3)}
.slider::-webkit-slider-thumb{width:21px;height:21px;box-shadow:0 2px 8px rgba(39,89,136,.27)}
.control-break{background:rgba(82,128,174,.17)}
.switch-row{font-size:13px}
.section{padding:24px}
.person-card{background:rgba(255,255,255,.73);border-color:rgba(255,255,255,.98);color:#245575}
.person-stats{color:#4d7492}
.person-card .person-top strong{font-size:13px}
.data-list{gap:13px}
.stage-caption{font-size:11px;line-height:1.5;color:#597998;margin-top:18px}
@media(max-width:1260px){.topbar{flex-wrap:wrap}.ux-mode-select{order:3;flex-basis:auto;min-width:0}.tabs{grid-template-columns:repeat(3,minmax(0,1fr)) repeat(2,minmax(112px,.8fr))}.tab{padding:17px 13px}.tab strong{font-size:19px}.tab-mini strong{font-size:14px}.workspace{grid-template-columns:95px minmax(0,1fr);gap:13px;padding:20px 16px}.contents{grid-template-columns:minmax(0,1fr) 300px;gap:12px}.petri{height:365px;min-height:365px}}
@media(max-width:1030px){.contents{grid-template-columns:minmax(0,1fr)}.control-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.study-meta{grid-column:1/-1}.petri{min-height:385px;height:385px}.timeline{width:100%;max-width:none}.masthead{align-items:stretch;flex-direction:column}.tabs{margin-left:0}}
@media(max-width:720px){.app-shell{padding:12px 10px 25px}.alpha-ribbon{font-size:9px}.topbar{gap:10px}.logo{width:157px}.ux-mode-select{order:3;flex-basis:100%;padding:4px 8px;gap:3px}.ux-mode-label{display:none}.ux-mode-buttons{width:100%}.ux-mode-buttons button{flex:1;min-width:0;padding:9px 10px}.top-actions{margin-left:auto;max-width:62%;gap:5px}.status-pill,.account-pill{font-size:10px;padding:9px 11px}.masthead{margin:22px 3px 15px;gap:13px}.masthead h1{font-size:30px}.tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.tab{min-height:73px;border-radius:23px 23px 0 0;padding:10px 8px}.tab.active{min-height:82px}.tab strong{font-size:13px}.tab small{display:none}.tab-mini{min-height:55px}.workspace{grid-template-columns:minmax(0,1fr);padding:11px 9px;gap:10px;border-radius:0 0 24px 24px;min-height:0}.subnav{min-height:0;display:flex;flex-direction:row;gap:7px;overflow-x:auto}.subnav-top{flex:0 0 auto}.subnav-top button{width:70px;min-height:62px;border-radius:18px}.subnav-stack{flex:1;min-height:0;display:flex;flex-direction:row;padding:3px 5px;gap:1px;border-radius:20px;justify-content:flex-start}.subnav button{font-size:10px;min-height:60px;padding:8px 5px;min-width:70px}.surface{min-height:0;padding:10px}.sim-topline h3{font-size:19px}.petri-population{font-size:17px}.petri{height:292px;min-height:292px}.petri .dot{width:10px;height:10px;border-width:1.5px}.petri .dot.player{width:15px;height:15px}.petri .bubble-label{font-size:7px;padding:2px 4px}.petri .bubble-label strong{font-size:7px}.control-panels{grid-template-columns:minmax(0,1fr)}.metrics{gap:5px}.metric{padding:11px 8px}.metric .big{font-size:20px}.metric .cap{font-size:9px}.timeline{min-width:0;gap:6px}.timeline-meta{min-width:125px}.legend{font-size:10px;gap:7px}.surface-title{margin:4px 7px 13px}}

/* ========================= POLISM V0.3 ALPHA 4 =========================
   Feedback: a compact, full-width village Panel above the Petri dish;
   stable bubble colors across individual dots and resident cards;
   brighter, integrated global timeline. No engine changes. */
.village-board{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
.control-deck{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(245px,.95fr);gap:14px;align-items:stretch;min-width:0}
.control-deck .controls-card{max-height:none;overflow:visible;padding:17px 21px;border-radius:25px}
.control-deck .control-head{margin-bottom:7px}
.control-deck .control-head h2{font-size:19px}
.control-deck .control-head .micro{font-size:9px}
.control-deck .control-break{margin:9px 0 5px}
.control-deck .helper{margin:6px 0 3px;font-size:10px;line-height:1.35}
.control-deck .switch-row{justify-content:flex-start;gap:12px}
.control-deck .switch{height:26px}
.control-deck .switch:after{width:19px;height:19px}
.control-deck .switch.on:after{transform:translateX(20px)}
.control-deck .control-line{padding:6px 2px 7px;min-width:0}
.control-deck .control-line-top{font-size:12px;align-items:center;min-height:24px}
.control-deck .control-value{white-space:nowrap;font-size:10px;padding:3px 6px}
.control-deck .control-ends{font-size:10px;line-height:1.2}
.control-deck .slider{margin:8px 0 7px;height:5px}
.control-deck .control-explain{font-size:10px;line-height:1.35;margin:4px 0 3px;min-height:27px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.control-deck .control-help{font-size:10px;margin:2px 0}
.control-deck .control-help p{margin:4px 0}
.control-deck-policy .policy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 14px;align-items:start}
.control-deck-policy .mode-footnote{padding:8px 12px;margin:8px 0;font-size:10px;line-height:1.4}
.control-deck-policy .mode-footnote .link-btn{display:inline;margin:0 0 0 5px}
.control-deck .button-row{margin-top:8px!important}
.control-deck .button-row button{padding:9px 12px;font-size:10px}
.control-deck-personal .person-stats{display:flex;gap:12px;justify-content:flex-start;font-size:11px}
.control-deck-personal .user-row{font-size:12px;padding:7px 0}
.control-deck-personal .control-line{padding:6px 2px}
.control-deck-personal .control-line .control-explain{min-height:0}
.control-deck-personal .button-row{gap:6px}
.control-deck-personal .button-row button{flex:1 1 auto}
.village-petri{min-width:0;padding:16px 19px 17px}
.village-petri .petri{height:340px;min-height:340px;max-width:940px;margin-inline:auto}
.village-petri .metrics{margin-top:12px}
.village-petri .metric{padding:13px 18px}
.village-petri .sim-topline{padding:3px 7px 11px}
.village-petri .legend{flex-wrap:wrap;margin-top:12px;gap:9px}
.village-petri .bubble{border:2px solid rgba(255,255,255,.91);box-shadow:0 4px 14px rgba(65,122,167,.10),inset 0 8px 26px rgba(255,255,255,.22)}
.village-petri .bubble[data-group="0"]{background:radial-gradient(ellipse at 37% 31%,rgba(203,235,253,.76),rgba(102,183,230,.50) 88%)}
.village-petri .bubble[data-group="1"]{background:radial-gradient(ellipse at 37% 31%,rgba(232,222,253,.80),rgba(173,145,226,.48) 90%)}
.village-petri .bubble[data-group="2"]{background:radial-gradient(ellipse at 37% 31%,rgba(220,251,242,.80),rgba(105,201,186,.46) 88%)}
.village-petri .bubble[data-group="3"]{background:radial-gradient(ellipse at 37% 31%,rgba(255,237,247,.81),rgba(233,161,196,.47) 90%)}
.village-petri .bubble-label{top:7%;background:rgba(251,254,255,.83);color:#365c78}
.village-petri .dot{width:13px;height:13px;box-shadow:0 0 0 1px rgba(255,255,255,.85),0 3px 7px rgba(42,90,127,.28),inset 0 1px 2px rgba(255,255,255,.75);border-width:1.6px}
.village-petri .dot[data-group="0"]{background:#9dcfed;border-color:#e5f7ff}
.village-petri .dot[data-group="1"]{background:#c8afea;border-color:#f6eaff}
.village-petri .dot[data-group="2"]{background:#a5e4d5;border-color:#f0fffa}
.village-petri .dot[data-group="3"]{background:#edb8d4;border-color:#fff1f8}
.village-petri .dot[data-group="outside"]{background:#d4dce3;border-color:#f8fbff}
.village-petri .dot.player{z-index:8;width:19px;height:19px;background:#4a9ac9;border:3px solid white;box-shadow:0 0 0 4px rgba(51,109,157,.34),0 4px 11px rgba(22,60,96,.28)}
/* Entry animation only once per village/run (rerenders every four seconds). */
@keyframes bubble-reveal{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:blur(0)}}
@keyframes dot-reveal{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
.village-petri .petri[data-intro="yes"] .bubble{animation:bubble-reveal 730ms ease-out var(--entry-delay,0ms) both,breath 10s ease-in-out var(--breath-offset,0s) infinite alternate}
.village-petri .petri[data-intro="yes"] .dot{animation:dot-reveal 620ms ease-out var(--entry-delay,0ms) both}
/* Same four pastel affiliations in the residents list and the Petri dish. */
.resident-legend{display:flex;flex-wrap:wrap;gap:7px 9px;align-items:center;margin:9px 0 17px;font-size:11px;color:#587d99}
.legend-chip{--group: #b6d5e8;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border:1px solid rgba(255,255,255,.73);padding:5px 9px;border-radius:30px;background:rgba(255,255,255,.34);color:#446c88;font-size:10px}
.legend-chip i,.resident-group-label i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--group);border:1px solid rgba(67,109,143,.12);flex-shrink:0}
.legend-chip[data-group="0"],.person-card[data-group="0"]{--group:#88c5e9;--group-bg:rgba(175,218,244,.64)}
.legend-chip[data-group="1"],.person-card[data-group="1"]{--group:#b9a1e1;--group-bg:rgba(213,199,240,.66)}
.legend-chip[data-group="2"],.person-card[data-group="2"]{--group:#88d1bf;--group-bg:rgba(177,229,216,.62)}
.legend-chip[data-group="3"],.person-card[data-group="3"]{--group:#e3a8c8;--group-bg:rgba(242,202,225,.68)}
.legend-chip[data-group="outside"],.person-card[data-group="outside"]{--group:#abb8c5;--group-bg:rgba(224,230,236,.77)}
.person-card[data-group="dead"]{--group:#aeb9c2;--group-bg:rgba(225,230,236,.5);opacity:.78}
.person-card[data-group]{border:1px solid rgba(255,255,255,.93);border-left:4px solid var(--group);background:linear-gradient(135deg,var(--group-bg),rgba(252,254,255,.68) 78%);box-shadow:0 4px 12px rgba(51,96,132,.055)}
.person-card[data-group]:hover{filter:saturate(1.18) brightness(1.012);box-shadow:0 7px 16px rgba(53,110,151,.12)}
.person-card[data-group] .av{background:var(--group-bg);color:#2f607e;border:1px solid rgba(255,255,255,.78)}
.resident-group-label{display:flex;align-items:center;gap:7px;color:#416882;font-size:11px;font-weight:600}
.resident-group-label i{background:var(--group)}
/* Timeline: material-consistent, not an oversized navy block. */
.timeline{background:linear-gradient(116deg,rgba(246,252,255,.88),rgba(216,236,250,.80) 55%,rgba(231,219,247,.68));border:1px solid rgba(255,255,255,.91);box-shadow:0 11px 30px rgba(57,117,161,.11),inset 0 1px 2px rgba(255,255,255,.97);color:#295b80}
.timeline .circle-play{background:linear-gradient(145deg,#abd9f6,#80bce8);color:#24597c;border-color:white;box-shadow:0 3px 12px rgba(44,112,158,.15),inset 0 1px 1px #fff}
.timeline .circle-pause{color:#336b96}
.timeline .modes{background:rgba(255,255,255,.53);border:1px solid rgba(255,255,255,.64)}
.timeline .modes button{color:#527b99}
.timeline .modes button.active{background:#b9d9f2;color:#235e87;box-shadow:inset 0 1px 1px rgba(255,255,255,.7)}
.timeline .timeline-meta{border-left-color:rgba(85,145,192,.27)}
.timeline .track{background:rgba(109,164,208,.22)}
.timeline .track>div{background:linear-gradient(90deg,#6db8e7,#c8a6e6)}
.timeline .timeline-icon{color:#487da2}
@media(max-width:1200px){.control-deck{grid-template-columns:minmax(0,1.7fr) minmax(230px,.9fr)}.control-deck-policy .policy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.village-petri .petri{height:325px;min-height:325px}}
@media(max-width:920px){.control-deck{grid-template-columns:minmax(0,1fr)}.control-deck-policy .policy-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.control-deck-personal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}.control-deck-personal .control-head,.control-deck-personal .user-row,.control-deck-personal .person-stats,.control-deck-personal .button-row,.control-deck-personal>.helper{grid-column:1/-1}}
@media(max-width:650px){.control-deck-policy .policy-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 9px}.control-deck .controls-card{padding:14px}.control-deck .control-line{padding:5px 0}.control-deck-personal{display:block}.control-deck .control-explain{min-height:0}.village-petri{padding:12px 10px}.village-petri .petri{height:286px;min-height:286px}.village-petri .dot{width:10px;height:10px}.village-petri .dot.player{width:15px;height:15px}.village-petri .metric{padding:11px 8px}.village-petri .legend{font-size:9px;gap:5px}.legend-chip{font-size:9px;padding:4px 6px}.resident-legend{gap:5px}}
@media(max-width:400px){.control-deck-policy .policy-grid{grid-template-columns:1fr}.village-petri .petri{height:260px;min-height:260px}}
@media(prefers-reduced-motion:reduce){.village-petri .petri[data-intro="yes"] .bubble,.village-petri .petri[data-intro="yes"] .dot{animation:none!important}}
/* A flex-column child with horizontal auto margins needs an explicit width:
   without this, the dish collapses to 4px although 100 dots exist. */
.village-petri .petri{width:100%}

/* POLISM Alpha 5 — atmospheric background. The grain and color movement are
   part of one compressed, reproducible, locally hosted texture. */
html{background:#e5f0fa}
body{
  background-image:linear-gradient(175deg,rgba(249,252,255,.05),rgba(249,251,255,.015) 38%,rgba(242,248,254,.065)),url('/assets/polism-atmosphere.webp');
  background-position:center top;
  background-size:cover;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
/* The exact pre-rendered identity is used as a raster asset, not redrawn as text. */
.logo{width:236px;height:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 5px 12px rgba(57,104,148,.08))}
.boot-screen img{max-width:280px}
@media(max-width:720px){
  body{background-attachment:scroll;background-size:100% 100%}
  .logo{width:179px}
}

/* Alpha 6: persistent group palette and readable political records. */
.legend-chip[data-group="0"],.person-card[data-group="0"]{ --group:#9dcfed;--group-bg:#9dcfed99; }
.village-petri .bubble[data-group="0"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#9dcfedaa);}
.village-petri .dot[data-group="0"]{background:#9dcfed;border-color:#fff;}
.legend-chip[data-group="1"],.person-card[data-group="1"]{ --group:#c8afea;--group-bg:#c8afea99; }
.village-petri .bubble[data-group="1"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#c8afeaaa);}
.village-petri .dot[data-group="1"]{background:#c8afea;border-color:#fff;}
.legend-chip[data-group="2"],.person-card[data-group="2"]{ --group:#a5e4d5;--group-bg:#a5e4d599; }
.village-petri .bubble[data-group="2"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#a5e4d5aa);}
.village-petri .dot[data-group="2"]{background:#a5e4d5;border-color:#fff;}
.legend-chip[data-group="3"],.person-card[data-group="3"]{ --group:#edb8d4;--group-bg:#edb8d499; }
.village-petri .bubble[data-group="3"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#edb8d4aa);}
.village-petri .dot[data-group="3"]{background:#edb8d4;border-color:#fff;}
.legend-chip[data-group="4"],.person-card[data-group="4"]{ --group:#efd39c;--group-bg:#efd39c99; }
.village-petri .bubble[data-group="4"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#efd39caa);}
.village-petri .dot[data-group="4"]{background:#efd39c;border-color:#fff;}
.legend-chip[data-group="5"],.person-card[data-group="5"]{ --group:#bcd58f;--group-bg:#bcd58f99; }
.village-petri .bubble[data-group="5"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#bcd58faa);}
.village-petri .dot[data-group="5"]{background:#bcd58f;border-color:#fff;}
.legend-chip[data-group="6"],.person-card[data-group="6"]{ --group:#a8b9e9;--group-bg:#a8b9e999; }
.village-petri .bubble[data-group="6"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#a8b9e9aa);}
.village-petri .dot[data-group="6"]{background:#a8b9e9;border-color:#fff;}
.legend-chip[data-group="7"],.person-card[data-group="7"]{ --group:#eab49c;--group-bg:#eab49c99; }
.village-petri .bubble[data-group="7"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#eab49caa);}
.village-petri .dot[data-group="7"]{background:#eab49c;border-color:#fff;}
.legend-chip[data-group="8"],.person-card[data-group="8"]{ --group:#c5c8a0;--group-bg:#c5c8a099; }
.village-petri .bubble[data-group="8"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#c5c8a0aa);}
.village-petri .dot[data-group="8"]{background:#c5c8a0;border-color:#fff;}
.legend-chip[data-group="9"],.person-card[data-group="9"]{ --group:#d6b8c0;--group-bg:#d6b8c099; }
.village-petri .bubble[data-group="9"]{background:radial-gradient(ellipse at 37% 31%,#ffffffaa,#d6b8c0aa);}
.village-petri .dot[data-group="9"]{background:#d6b8c0;border-color:#fff;}
.policy-tendency{max-width:44em;font-size:12px;line-height:1.5;margin:6px 0}.political-detail{margin-top:24px;border-top:1px solid #b6c9d9;padding-top:18px}.ballot{padding:10px 0;border-bottom:1px solid #c3d5e3}.ballot summary{cursor:pointer;line-height:1.6}.political-data{white-space:pre-wrap;overflow-wrap:anywhere}.ux-mode-buttons button:disabled{opacity:.6;cursor:not-allowed}.tabs .tab small{line-height:1.5}.resident-legend{flex-wrap:wrap}.political-detail .stats-table{max-width:100%;overflow-x:auto}.political-detail th,.political-detail td{white-space:nowrap}
@media(max-width:720px){.tabs .tab small{display:block;font-size:9px}.ux-mode-buttons button{padding:8px 5px}.ux-mode-buttons button span{font-size:11px}}

.about-link{display:inline-block;color:#315f83;text-decoration:underline;text-underline-offset:3px;padding:10px 12px;font-size:13px}.about-link:focus-visible{outline:3px solid #416e94;outline-offset:3px}