/* ΑΝΕΙΠΩΤΟ · Greek literary typesetting · edition 29
 * Designed first for reading, then for ornament. All important information is textual.
 * Cascades after reader/atelier/compass to settle conflicting mobile rules. */
:root{
  --serif:"GFS Artemisia","Noto Serif",Georgia,serif;
  --display:"GFS Didot","GFS Artemisia",Georgia,serif;
  --italic:"GFS Neohellenic","GFS Artemisia",Georgia,serif;
  --sans:"Noto Sans",system-ui,sans-serif;
  --ink:#f0eae0; --dim:#d2c6b9; --quiet:#b5a99d;
  --line:rgba(233,222,210,.23); --accent:#d4b7a0;
}
html{min-width:0;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:clip;-webkit-font-smoothing:antialiased;line-height:1.6}
main,section,article,aside,.site-shell,.story-sheet,.room-stage,.room-card,.compass{min-width:0}
p,blockquote,.story-content,.room-stage blockquote{overflow-wrap:break-word;word-break:normal}
.intro h1,.section-index+h2,.compass-heading h2,.story-body h3,.rooms-head h2,.imprint-heading h2{
  font-family:var(--display);font-weight:400;font-synthesis:none;letter-spacing:-.026em;
  text-wrap:balance;
}
.intro h1 em,.story-head h2 em,.rooms-head h2 em,.compass-heading h2 em,
.imprint-heading h2 em,.closing-note em{font-family:var(--italic);font-weight:400;letter-spacing:-.01em}
.wordmark{font-family:var(--display);font-weight:400;letter-spacing:.13em}
.intro-description,.story-lead,.rooms-head>p,.compass-heading>p,.imprint-heading p{
  font-family:var(--serif);font-size:clamp(18px,1.6vw,23px);line-height:1.7;
  color:#d6c8ba;max-width:48ch;text-wrap:pretty;
}
.intro-meta,.section-index,.room-number,.quote-header,.quote-footer,
.story-masthead,.story-colophon,.compass-field,.compass-privacy,.room-stage-actions{
  font-family:var(--sans);letter-spacing:.065em
}
.quote-text,.room-stage blockquote,.last-words{
  font-family:var(--serif);font-weight:400;font-synthesis:none;
  letter-spacing:0;line-height:1.55;white-space:pre-line;text-wrap:pretty;
}
.daily-panel .quote-text{font-size:clamp(34px,3.6vw,59px);line-height:1.52}
.room-stage blockquote{font-size:clamp(30px,3.05vw,48px);line-height:1.57}
.room-stage h3{font-family:var(--italic);font-size:clamp(27px,2.5vw,41px)}
.story-body h3{font-family:var(--display);font-size:clamp(44px,5.3vw,77px);line-height:1.1;max-width:20ch}
.story-content{
  font-family:var(--serif);font-size:clamp(18px,1.65vw,22px);
  line-height:1.91;max-width:68ch;letter-spacing:0;
  text-align:start;hyphens:auto;orphans:3;widows:3;
}
.story-content p{margin:0 0 1.35em;text-wrap:pretty}
.story-content p:first-child::first-letter{font-family:var(--display);font-size:1.3em;color:#ddc3ae}
.story-sheet{background:#19191a}
.rooms-grid{align-items:stretch}
.room-card{min-width:0;touch-action:manipulation}
.room-name{font-family:var(--display);letter-spacing:-.016em;line-height:1.16;text-wrap:balance}
.room-card[aria-pressed="true"]{outline-offset:-2px}
.compass-field input{font-family:var(--serif);font-size:clamp(19px,2vw,26px)}
.compass-result,.compass-empty,.compass-response-head{overflow-wrap:break-word}
.compass-result p,.compass-result blockquote{font-family:var(--serif);line-height:1.65}
.compass-field button,.compass-suggestions button,.room-stage-actions button,.imprint-controls button{
  min-height:44px;touch-action:manipulation
}
.sky-text{font-family:var(--italic);font-size:clamp(20px,2.1vw,28px);line-height:1.45}
.last-words{max-width:70ch}
@media (min-width:1450px){
  .site-shell{max-width:1380px}
  .story-body{max-width:100%}
  .story-content{font-size:21px}
}
@media (max-width:1024px){
  .site-shell{width:calc(100% - 56px)}
  .intro{min-height:0;padding:86px 0 80px}
  .intro h1{max-width:920px;font-size:clamp(67px,8.2vw,99px);line-height:1.09}
  .intro-description{font-size:19px}
  .experience{grid-template-columns:minmax(0,1.55fr) minmax(240px,.8fr)}
  .daily-panel .quote-text{font-size:clamp(36px,4.2vw,50px);padding:62px 42px 55px}
  .rooms-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .room-name{font-size:26px}
  .room-card{min-height:166px}
  .compass-heading{grid-template-columns:1fr}
}
@media (max-width:760px){
  .site-shell{width:calc(100% - 42px)}
  .site-header{min-height:80px;gap:14px}
  .intro{padding:78px 0 62px}
  .intro h1{font-size:clamp(58px,9.8vw,80px);max-width:620px}
  .intro-description{font-size:19px}
  .experience{grid-template-columns:1fr;gap:26px}
  .daily-panel .quote-text{padding:69px 35px 52px;font-size:clamp(36px,5.4vw,48px)}
  .aside-panel{grid-template-columns:1fr 1fr;gap:20px}
  .folio-art{min-height:180px;height:190px}
  .daily-story{margin-top:81px;padding-top:78px}
  .story-body{padding:45px 31px 39px}
  .story-content{font-size:19px;line-height:1.89}
  .rooms{padding-top:90px}
  .rooms-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .room-card{min-height:148px;padding:18px}
  .room-name{font-size:25px}
  .room-stage{padding:35px 29px}
  .compass{padding:86px 0}
  .compass-field{gap:12px}
  .imprint-frame{height:320px}
}
@media (max-width:560px){
  .site-shell{width:calc(100% - 36px);padding:0;max-width:100%}
  .site-header{min-height:71px;gap:9px;flex-wrap:nowrap}
  .wordmark{font-size:clamp(15px,4.45vw,19px);letter-spacing:.10em;min-width:0}
  .wordmark-star{font-size:18px;margin-right:2px}
  .manifesto-trigger{flex:0 0 auto;font-size:12px;padding:10px 9px!important;min-height:44px;white-space:nowrap}
  .intro{min-height:0;padding:56px 0 39px}
  .intro .eyebrow{font-size:10px;line-height:1.6;letter-spacing:.08em;max-width:100%}
  .intro h1{font-size:clamp(44px,12.1vw,67px);line-height:1.12;letter-spacing:-.03em;
   margin:30px 0 24px;text-wrap:balance;max-width:100%}
  .intro h1 span,.intro h1 em{display:inline;max-width:100%}
  .hero-artwork{right:-32%;top:20px;width:92%;opacity:.15;pointer-events:none}
  .hero-art-label{display:none}
  .intro-description{font-size:18px;line-height:1.7;margin:0;color:#ded1c4;max-width:34ch}
  .intro-meta{gap:10px 16px;margin-top:24px}
  .intro-meta span{font-size:10px;line-height:1.6}
  .midnight-stamp{margin-top:26px;padding:15px 12px;gap:10px;min-height:76px}
  .midnight-glyph{font-size:29px;flex:0 0 auto}
  .midnight-copy{min-width:0;flex:1}
  .midnight-copy>span{font-size:9px;letter-spacing:.055em}
  .midnight-copy strong{font-size:12px;line-height:1.55;font-weight:500;display:block}
  .midnight-time{font-size:16px;flex:0 0 auto}
  .sky-strip{display:flex;flex-direction:column;gap:9px;align-items:flex-start;padding:23px 0;min-height:0}
  .sky-label{font-size:10px;letter-spacing:.09em}
  .sky-text{text-align:left;font-size:23px;line-height:1.48}
  .experience{margin-top:10px;gap:16px}
  .daily-panel{min-height:0}
  .quote-header{padding:18px 17px;gap:12px;min-height:58px;display:flex;flex-wrap:wrap;align-items:center}
  .quote-header span{font-size:9px;line-height:1.7}
  .quote-art-index{right:12px;top:64px;opacity:.30;pointer-events:none}
  .quote-art-index span:first-child{font-size:43px}
  .daily-panel .quote-text{padding:85px 23px 47px;margin:0;font-size:clamp(30px,8vw,40px);
   line-height:1.55;letter-spacing:0;white-space:pre-line;hyphens:none;overflow-wrap:break-word}
  .quote-footer{display:flex;flex-wrap:wrap;align-items:center;gap:8px;
   padding:18px 18px 19px;font-size:9px;letter-spacing:.05em}
  .quote-footer span{white-space:normal}
  .aside-panel{display:grid!important;grid-template-columns:1fr!important;gap:12px}
  .folio-art{display:flex!important;min-height:165px;height:165px;width:100%;overflow:hidden}
  .art-caption{padding-top:11px;font:400 15px/1.55 var(--sans);letter-spacing:.065em}
  .next-label{margin-top:12px;font-size:10px}
  .aside-note{font-size:12px;line-height:1.65}
  .ambient-sound{min-height:48px;padding:13px 15px;font-size:13px}
  .daily-story{margin:73px 0 0;padding:66px 0 58px}
  .story-head,.rooms-head{grid-template-columns:1fr;gap:14px}
  .story-head{margin-bottom:26px}
  .story-head h2,.rooms-head h2,.compass-heading h2,.imprint-heading h2{
   font-size:clamp(45px,10.8vw,60px);line-height:1.13;letter-spacing:-.026em}
  .story-lead,.rooms-head>p,.compass-heading>p,.imprint-heading p{
   font-size:17px;line-height:1.73;max-width:38ch}
  .story-sheet{min-width:0;width:100%;border-radius:0;box-shadow:none}
  .story-art{min-height:130px;max-height:165px;overflow:hidden}
  .story-masthead{display:flex;gap:7px;flex-wrap:wrap;padding:16px 17px 12px;font-size:9px}
  .story-masthead>*{font-size:9px;white-space:normal}
  .story-body{padding:25px 19px 32px}
  .story-theme{font-size:9px;line-height:1.6;letter-spacing:.07em}
  .story-body h3{font-size:clamp(36px,8.6vw,49px);line-height:1.19;margin:20px 0 26px;max-width:100%;text-wrap:balance}
  .story-content{font-size:18px;line-height:1.89;hyphens:auto;overflow-wrap:break-word}
  .story-content p{margin:0 0 1.45em}
  .story-colophon{display:flex;flex-wrap:wrap;gap:8px 15px;line-height:1.5;font-size:9px}
  .compass{padding:72px 0 75px}
  .compass-heading{margin-bottom:26px;gap:16px}
  .compass-form{padding:21px 16px;max-width:100%}
  .compass-form>label{font-size:10px}
  .compass-field{display:flex;flex-direction:column;gap:10px;border-bottom:0;align-items:stretch}
  .compass-field input{min-height:50px;padding:11px 0 12px;font-size:19px;line-height:1.55;
    border-bottom:1px solid rgba(233,222,210,.5);width:100%}
  .compass-field button{align-self:stretch;min-height:47px;justify-content:center;
    padding:12px 16px;font-size:13px;white-space:normal}
  .compass-suggestions{gap:7px}
  .compass-suggestions button{font-size:12px;min-height:44px;padding:10px 12px}
  .compass-response{margin-top:20px;min-width:0}
  .compass-response-head{display:flex;flex-wrap:wrap;gap:8px 15px;line-height:1.6}
  .compass-result{min-width:0}
  .compass-privacy{font-size:11px;line-height:1.6}
  .rooms{padding:71px 0 68px}
  .rooms-head{gap:19px;margin-bottom:28px}
  .rooms-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border:1px solid var(--line)}
  .room-card{min-height:146px;min-width:0;padding:16px 13px;gap:10px 6px}
  .room-card .room-number{font-size:9px;line-height:1.5;letter-spacing:.055em;max-width:94%;overflow-wrap:break-word}
  .room-card .room-name{font-size:clamp(22px,5.5vw,27px);line-height:1.19;max-width:100%;position:relative;z-index:2}
  .room-card-symbol{font-size:15px;top:auto;bottom:14px;left:auto;right:15px}
  .room-abstract{width:77%;height:67%;opacity:.54;right:0;top:0}
  .room-stage{padding:29px 19px;margin-top:15px;min-height:0}
  .room-stage-top{display:flex;gap:10px;flex-wrap:wrap;line-height:1.7;font-size:9px}
  .room-stage h3{font-size:25px;line-height:1.4;margin:19px 0 15px}
  .room-stage blockquote{font-size:clamp(30px,7.45vw,38px);line-height:1.55;
   max-width:100%;white-space:pre-line;hyphens:none;margin:14px 0 29px}
  .room-stage-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .room-stage-actions span{font-size:9px;line-height:1.4}
  .room-stage-actions button{width:100%;min-height:46px;display:flex;align-items:center;justify-content:space-between;
    padding:11px 15px;border:1px solid rgba(210,182,160,.32);font-size:13px;text-align:left}
  .imprint-section{padding-top:68px;padding-bottom:55px}
  .imprint-heading{display:block}
  .imprint-heading h2{margin-bottom:23px}
  .imprint-frame{height:278px;overflow:hidden}
  .imprint-controls{padding:16px;align-items:flex-start;flex-direction:column;gap:12px}
  .imprint-controls>div{display:flex;flex-wrap:wrap;gap:8px 14px}
  .imprint-controls button{min-height:44px;font-size:12px}
  .closing-note{padding:64px 0 74px}
  .last-words{font-size:clamp(30px,7.8vw,41px);line-height:1.52;white-space:pre-line}
  .colophon{padding:30px 0 40px;gap:9px;line-height:1.7;flex-direction:column;align-items:flex-start}
  .manifesto-dialog{width:calc(100% - 28px);max-height:calc(100dvh - 28px)}
  .manifesto-dialog-inner{padding:28px 20px}
  .manifesto-body p{font-size:18px;line-height:1.8}
}
@media (max-width:360px){
  .site-shell{width:calc(100% - 28px)}
  .wordmark{font-size:14px}
  .manifesto-trigger{font-size:11px}
  .intro h1{font-size:clamp(39px,11.5vw,44px)}
  .midnight-stamp{padding:11px 9px;gap:6px}
  .midnight-glyph{font-size:22px}
  .midnight-copy>span{font-size:8px}
  .midnight-copy strong{font-size:11px}
  .midnight-time{font-size:14px}
  .room-card{min-height:139px;padding:13px 10px}
  .room-card .room-name{font-size:21px}
  .room-card .room-number{font-size:8px}
  .room-stage blockquote{font-size:29px}
  .daily-panel .quote-text{font-size:30px;padding-left:17px;padding-right:17px}
  .story-body{padding:22px 15px}
  .story-content{font-size:17px}
  .story-body h3{font-size:35px}
  .compass-form{padding:17px 13px}
}
@media (max-height:440px) and (orientation:landscape){
  .intro{min-height:0;padding:38px 0}
  .intro h1{font-size:clamp(42px,6vw,72px)}
  .room-card{min-height:112px}
  .imprint-frame{height:210px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0s!important;scroll-behavior:auto!important}
}
@media print{
  body{background:white!important;color:#141414!important}
  .hero-artwork,.ambient-sound,.compass,.imprint-section,.folio-art,.midnight-stamp,.manifesto-trigger{display:none!important}
  .site-shell{width:100%;max-width:100%}
  .story-content{font-size:14pt;line-height:1.8}
  .room-stage,.story-sheet,.daily-panel{break-inside:avoid;box-shadow:none;border-color:#999!important}
}

/* Small-phone Greek line breaking and modern safe-area landscape insets. */
@media (max-width:560px){
  .site-shell{
    width:calc(100% - 36px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
  }
  .room-card .room-name{hyphens:auto;overflow-wrap:anywhere}
}
@media (max-width:360px){
  .site-shell{
    width:calc(100% - 28px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
  }
}