/* THE MERCURIAL WORLD — HOME THRESHOLD v0.7.15 Owner-directed recovery: threshold = transformation; Central Court = orientation. Recovers living Hg pattern behavior, resonance language, explicit Court entry, legibility, and Dispatch. */ body.home-threshold-v068 .threshold-stage{box-sizing:border-box;place-items:start center;padding:clamp(30px,4.5vh,58px) clamp(16px,3vw,40px) clamp(40px,6vh,72px)} .home-threshold-frame{min-height:min(720px,calc(100svh - 128px));padding:clamp(34px,4.4vw,64px)} .threshold-creator{font-size:.64rem!important;line-height:1.65!important;letter-spacing:.095em!important;color:#87989b!important} .threshold-creator a{color:#ccb57e!important} .threshold-v068-copy .threshold-lead{color:#96a5a7} .threshold-register{font-size:.58rem;color:#718589} .threshold-v068-instrument-zone{min-height:548px;grid-template-rows:auto 1fr auto auto;align-content:center} .threshold-resonance-line{width:min(470px,41vw);display:flex;justify-content:flex-end;margin-bottom:-22px;z-index:10} .threshold-resonance{appearance:none;border:0;background:transparent;color:#c5ad74;font:600 .54rem/1 var(--mono);letter-spacing:.16em;padding:7px 0 7px 12px;cursor:pointer;text-transform:uppercase} .threshold-resonance::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:7px;background:#d2b46c;box-shadow:0 0 11px rgba(210,180,108,.42);vertical-align:1px} .threshold-resonance[aria-pressed="false"]{color:#687a7d}.threshold-resonance[aria-pressed="false"]::before{background:#50666a;box-shadow:none} .threshold-v068-instrument{cursor:default;overflow:visible} .threshold-v068-instrument::before{opacity:.38}.threshold-v068-instrument::after{inset:8%;border-color:rgba(207,175,110,.18)} .threshold-pattern-field{position:absolute;inset:4%;z-index:3;border-radius:50%;overflow:visible;pointer-events:none} .threshold-pattern-dot{position:absolute;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;border-radius:50%;background:#d8c087;box-shadow:0 0 7px rgba(218,194,136,.32);transition:left 1.45s cubic-bezier(.24,.72,.2,1),top 1.45s cubic-bezier(.24,.72,.2,1),opacity .8s ease,transform .8s ease;opacity:.68} .threshold-pattern-dot:nth-child(4n){background:#b9e0e2;box-shadow:0 0 8px rgba(185,224,226,.35)} .threshold-register-lines{position:absolute;inset:10%;z-index:2;border-radius:50%;pointer-events:none;opacity:.42;transition:transform 1.5s ease} .threshold-register-lines span{position:absolute;left:50%;top:50%;width:88%;height:34%;border:1px solid rgba(155,202,209,.15);border-radius:50%;transform:translate(-50%,-50%) rotate(var(--r))} .threshold-register-lines span:nth-child(1){--r:0deg}.threshold-register-lines span:nth-child(2){--r:60deg;border-color:rgba(211,177,108,.17)}.threshold-register-lines span:nth-child(3){--r:-60deg} [data-threshold-pattern="branch"] .threshold-register-lines{transform:rotate(-8deg) scale(.96)} [data-threshold-pattern="shell"] .threshold-register-lines{transform:rotate(0deg) scale(1.02)} [data-threshold-pattern="seal"] .threshold-register-lines{transform:rotate(18deg) scale(.92)} .hg-nucleus{appearance:none;cursor:pointer;padding:0;font:inherit} .hg-nucleus:hover,.hg-nucleus:focus-visible{outline:none;border-color:rgba(226,204,155,.82);box-shadow:0 0 0 10px rgba(155,202,209,.025),0 0 62px rgba(155,202,209,.16),inset 0 0 36px rgba(207,175,110,.08)} .hg-nucleus:active{transform:scale(.97)} .threshold-pattern-readout{position:absolute;z-index:7;bottom:6.3%;left:50%;transform:translateX(-50%);display:grid;justify-items:center;gap:4px;white-space:nowrap;text-transform:uppercase;font-family:var(--mono)} .threshold-pattern-readout b{font-size:.53rem;letter-spacing:.17em;color:#c8ae72;font-weight:600}.threshold-pattern-readout small{font-size:.43rem;letter-spacing:.13em;color:#697e82} .threshold-court-link{width:min(470px,91%);min-height:42px;margin:-10px 0 15px;display:flex;align-items:center;justify-content:center;gap:12px;border-top:1px solid rgba(207,175,110,.18);border-bottom:1px solid rgba(155,202,209,.12);text-decoration:none;text-transform:uppercase;font-family:var(--mono);letter-spacing:.14em;position:relative;z-index:9} .threshold-court-link strong{font-size:.59rem;color:#dcc995}.threshold-court-link span{font-size:.5rem;color:#81969a}.threshold-court-link:hover,.threshold-court-link:focus-visible{outline:none;border-color:rgba(207,175,110,.45);background:rgba(207,175,110,.022)}.threshold-court-link:hover span,.threshold-court-link:focus-visible span{color:#c2e4e6} .threshold-v068-routes{margin-top:0} /* Dispatch: functional contact lives inside the world, but remains plain about what it does. */ .dispatch-launch{position:fixed;right:16px;bottom:16px;z-index:2147481900;min-height:35px;display:flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid rgba(207,175,110,.32);border-radius:18px;background:rgba(5,7,7,.88);backdrop-filter:blur(14px);color:#bda66f;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.32)} .dispatch-launch span{font:400 17px/1 Georgia,serif;color:#e8e6dc}.dispatch-launch strong{font:600 .48rem/1 var(--mono);letter-spacing:.13em}.dispatch-launch:hover,.dispatch-launch:focus-visible{outline:none;border-color:rgba(207,175,110,.62);color:#e2ca91;background:#080a09} .dispatch-dialog{width:min(760px,calc(100vw - 34px));padding:0;border:1px solid rgba(207,175,110,.58);background:linear-gradient(90deg,#060707 0 35%,#090a09 35% 100%);color:#e9e5da;box-shadow:0 34px 110px rgba(0,0,0,.78);overflow:visible} .dispatch-dialog[open]{display:grid;grid-template-columns:35% 65%}.dispatch-dialog::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(7px)} .dispatch-close{position:absolute;right:12px;top:12px;width:31px;height:31px;border:1px solid rgba(155,202,209,.18);background:#050707;color:#d9dfdd;cursor:pointer;font-size:1rem}.dispatch-close:hover,.dispatch-close:focus-visible{outline:none;border-color:rgba(207,175,110,.55);color:#fff} .dispatch-emblem{min-height:430px;display:grid;place-items:center;align-content:center;gap:18px;border-right:1px solid rgba(155,202,209,.06);background:radial-gradient(circle at 50% 49%,rgba(207,175,110,.05),transparent 37%)} .dispatch-emblem>div{width:140px;height:140px;border:1px solid rgba(207,175,110,.4);border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 17px rgba(207,175,110,.025),0 0 0 42px rgba(155,202,209,.012),inset 0 0 32px rgba(207,175,110,.04)}.dispatch-emblem>div span{font:400 63px/.8 Georgia,serif;color:#e3c176}.dispatch-emblem small{font:600 .43rem/1 var(--mono);letter-spacing:.15em;color:#9c824b;text-transform:uppercase} .dispatch-copy{padding:56px 54px 48px}.dispatch-eyebrow{display:block;margin-bottom:12px;color:#b99b5a;font:600 .48rem/1 var(--mono);letter-spacing:.17em}.dispatch-copy h2{margin:0 0 12px;font:400 clamp(2.7rem,5vw,4.5rem)/.88 Georgia,serif;letter-spacing:-.035em;color:#efe7d7}.dispatch-copy>p{margin:0 0 24px;max-width:430px;color:#a5b0b0;font-size:.82rem;line-height:1.55}.dispatch-copy form{display:grid;gap:13px}.dispatch-copy label{display:grid;gap:6px}.dispatch-copy label>span{color:#a88c51;font:600 .44rem/1 var(--mono);letter-spacing:.13em}.dispatch-copy input,.dispatch-copy textarea{width:100%;box-sizing:border-box;border:1px solid rgba(164,187,187,.2);background:#050606;color:#eef0ea;padding:10px 11px;font:400 .86rem/1.4 system-ui,sans-serif;outline:none}.dispatch-copy input:focus,.dispatch-copy textarea:focus{border-color:rgba(207,175,110,.58);box-shadow:0 0 0 2px rgba(207,175,110,.035)}.dispatch-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.dispatch-submit{justify-self:start;margin-top:3px;border:0;border-radius:18px;background:#e6ca87;color:#15120d;padding:10px 17px;font:700 .49rem/1 var(--mono);letter-spacing:.13em;cursor:pointer}.dispatch-submit:hover,.dispatch-submit:focus-visible{outline:2px solid rgba(185,224,226,.35);outline-offset:2px}.dispatch-address{color:#627679;font:600 .47rem/1.4 var(--mono);letter-spacing:.09em} .dispatch-privacy{display:block;max-width:430px;color:#718183;font:500 .43rem/1.5 var(--mono);letter-spacing:.035em}.dispatch-privacy a{color:#9bb8bd;text-decoration:underline;text-underline-offset:2px} @media(max-width:900px){body.home-threshold-v068 .threshold-stage{padding-top:26px}.threshold-resonance-line{width:min(430px,72vw)}.threshold-court-link{width:min(430px,72vw)}} @media(max-width:620px){body.home-threshold-v068 .threshold-stage{padding-top:12px}.threshold-creator{font-size:.58rem!important}.threshold-resonance-line{width:min(330px,88vw);margin-bottom:-17px}.threshold-pattern-readout{bottom:5%}.threshold-pattern-readout b{font-size:.47rem}.threshold-pattern-readout small{font-size:.39rem}.threshold-court-link{width:90%;margin:-2px 0 10px;min-height:44px;flex-direction:column;gap:2px}.dispatch-launch{left:10px;right:auto;bottom:10px}.dispatch-dialog[open]{display:block;background:#080909}.dispatch-emblem{min-height:150px;border-right:0;border-bottom:1px solid rgba(155,202,209,.06)}.dispatch-emblem>div{width:88px;height:88px}.dispatch-emblem>div span{font-size:43px}.dispatch-copy{padding:34px 22px 28px}.dispatch-fields{grid-template-columns:1fr}} @media(prefers-reduced-motion:reduce){.threshold-pattern-dot{transition:none!important}} /* v0.7.15 mobile containment correction — keep the living instrument inside the usable threshold width left of the permanent Mercurial rail. */ @media(max-width:620px){ .threshold-resonance-line{ width:100%; max-width:286px; justify-content:center; margin:0 auto -10px; } .threshold-resonance{padding:7px 8px;font-size:.50rem;letter-spacing:.13em} .threshold-v068-instrument-zone{min-height:382px;overflow:visible} .threshold-v068-instrument{width:min(300px,100%)} .threshold-v068-instrument-zone::before{width:min(306px,100%)} .threshold-pattern-readout{max-width:94%;white-space:normal;text-align:center;line-height:1.35} .threshold-court-link{width:94%} .dispatch-launch{left:10px;right:auto;bottom:10px;width:39px;height:39px;min-height:39px;padding:0;justify-content:center;border-radius:50%} .dispatch-launch span{font-size:19px} .dispatch-launch strong{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} } /* Owner legibility gate: provenance should read as information, not decoration. */ .threshold-creator{font-size:.68rem!important} @media(max-width:620px){.threshold-creator{font-size:.62rem!important}} /* R4 — single-threshold Central Court invitation. The lower Story/Pattern fork is removed. */ .threshold-court-link{ width:min(610px,94%); min-height:76px; margin:-6px 0 24px; padding:14px 26px; flex-direction:column; gap:5px; border:1px solid rgba(229,190,105,.58); border-radius:5px; background: radial-gradient(120% 180% at 50% 120%,rgba(225,175,70,.12),transparent 55%), linear-gradient(180deg,rgba(25,20,12,.78),rgba(7,8,8,.96)); box-shadow: inset 0 1px 0 rgba(255,240,192,.09), inset 0 0 24px rgba(205,154,52,.055), 0 0 0 1px rgba(126,91,29,.18), 0 14px 44px rgba(0,0,0,.34); transition:border-color .24s ease,box-shadow .24s ease,background .24s ease,transform .18s ease; overflow:hidden; } .threshold-court-link:before{ content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none; opacity:.46; background:linear-gradient(90deg,transparent 0 12%,rgba(255,219,133,.7) 34%,rgba(255,244,203,.9) 50%,rgba(255,219,133,.7) 66%,transparent 88%); transform:translateX(-115%); } .threshold-court-link:after{ content:""; position:absolute; inset:6px; border:1px solid rgba(220,180,91,.15); border-radius:3px; pointer-events:none; } .threshold-court-link strong{font-size:.78rem;letter-spacing:.18em;color:#f0d993;text-shadow:0 0 14px rgba(230,183,76,.16)} .threshold-court-link span{font-size:.53rem;letter-spacing:.19em;color:#a69568} .threshold-court-link:hover,.threshold-court-link:focus-visible{ outline:none; transform:translateY(-2px); border-color:rgba(255,215,124,.92); background: radial-gradient(120% 180% at 50% 120%,rgba(238,184,70,.19),transparent 58%), linear-gradient(180deg,rgba(31,24,13,.88),rgba(8,9,8,.98)); box-shadow: inset 0 1px 0 rgba(255,244,208,.14), inset 0 0 34px rgba(218,165,58,.075), 0 0 0 1px rgba(212,164,66,.28), 0 0 22px rgba(225,176,68,.18), 0 18px 54px rgba(0,0,0,.42); } .threshold-court-link:hover span,.threshold-court-link:focus-visible span{color:#d8c38c} .threshold-court-link:hover:before,.threshold-court-link:focus-visible:before{animation:court-threshold-shimmer 1.6s ease both} .threshold-court-link.is-entering{ transform:translateY(1px) scale(.995); border-color:rgba(255,225,151,.98); box-shadow:inset 0 0 44px rgba(235,182,67,.14),0 0 34px rgba(235,182,67,.25),0 14px 44px rgba(0,0,0,.42); } .threshold-court-link.is-entering:before{animation:court-threshold-shimmer .48s ease both} @keyframes court-threshold-shimmer{0%{transform:translateX(-115%);opacity:0}18%{opacity:.55}100%{transform:translateX(115%);opacity:0}} @media(max-width:900px){.threshold-court-link{width:min(520px,84vw);min-height:72px}} @media(max-width:620px){.threshold-court-link{width:92%;min-height:68px;margin:2px 0 16px;padding:12px 16px}.threshold-court-link strong{font-size:.68rem}.threshold-court-link span{font-size:.47rem}} @media(prefers-reduced-motion:reduce){.threshold-court-link{transition:none}.threshold-court-link:hover,.threshold-court-link:focus-visible,.threshold-court-link.is-entering{transform:none}.threshold-court-link:before{display:none}} /* EXPERIENCE R16 — threshold wake-on-arrival. The visual instrument must feel alive before interaction. Audible autoplay remains browser-governed; JS attempts the chime immediately and falls back to first gesture. */ .threshold-v068-instrument-zone.is-arriving .threshold-v068-instrument::before{ animation:hg-threshold-arrival-halo 1.75s ease-out both; } .threshold-v068-instrument-zone.is-arriving .hg-nucleus{ animation:hg-threshold-arrival-core 1.6s cubic-bezier(.2,.72,.18,1) both; } .threshold-v068-instrument-zone.is-arriving .threshold-register-lines{ animation:hg-threshold-arrival-rings 1.85s cubic-bezier(.2,.72,.18,1) both; } .threshold-v068-instrument-zone.is-awake .threshold-resonance::before{ animation:hg-threshold-resonance-breathe 3.6s ease-in-out infinite; } @keyframes hg-threshold-arrival-halo{ 0%{opacity:.08;filter:blur(3px)} 42%{opacity:.66;filter:blur(.35px)} 100%{opacity:.38;filter:none} } @keyframes hg-threshold-arrival-core{ 0%{transform:scale(.82);opacity:.58;box-shadow:0 0 0 0 rgba(155,202,209,0),inset 0 0 0 rgba(207,175,110,0)} 44%{transform:scale(1.035);opacity:1;box-shadow:0 0 0 12px rgba(155,202,209,.028),0 0 74px rgba(207,175,110,.17),inset 0 0 34px rgba(207,175,110,.09)} 100%{transform:scale(1);opacity:1} } @keyframes hg-threshold-arrival-rings{ 0%{opacity:.08;transform:rotate(-28deg) scale(.72)} 58%{opacity:.55;transform:rotate(4deg) scale(1.035)} 100%{opacity:.42} } @keyframes hg-threshold-resonance-breathe{ 0%,100%{box-shadow:0 0 9px rgba(210,180,108,.28)} 50%{box-shadow:0 0 16px rgba(210,180,108,.58)} } @media(prefers-reduced-motion:reduce){ .threshold-v068-instrument-zone.is-arriving .threshold-v068-instrument::before, .threshold-v068-instrument-zone.is-arriving .hg-nucleus, .threshold-v068-instrument-zone.is-arriving .threshold-register-lines, .threshold-v068-instrument-zone.is-awake .threshold-resonance::before{animation:none!important} }