:root{color-scheme:dark;--walnut:#30291f;--deep:#24281f;--moss:#414a32;--olive:#626849;--tobacco:#806449;--paper:#d5c6a7;--muted:#a99d82}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 70% 0%,#4a4e37 0%,transparent 40%),linear-gradient(135deg,#392e22,#283126 75%);color:var(--paper);font-family:Georgia,'Times New Roman',serif}.grain{position:fixed;inset:0;pointer-events:none;opacity:.1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.wrap{position:relative;width:min(1220px,94%);margin:auto;padding:22px 0 42px}.top{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid #96845f77;padding-bottom:18px}.top h1{margin:0;font-weight:normal;font-size:clamp(26px,3vw,39px);letter-spacing:.01em}.hero{display:grid;grid-template-columns:46% 54%;min-height:260px;margin:22px 0 27px;background:#323829;border:1px solid #87744f88;border-radius:7px;overflow:hidden;box-shadow:0 14px 40px #191d1733}.art{min-height:270px;background:#313b2c url('assets/woodland.svg') center/cover no-repeat;border-right:1px solid #87744f77}.hero-right{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 35px;background:radial-gradient(circle at 80% 10%,#4a4e36 0%,transparent 60%)}.hero-mark{font-size:40px;color:#a68d60;margin-bottom:28px}.search{width:100%;max-width:530px}.search label{display:block;text-transform:uppercase;letter-spacing:.16em;font:11px system-ui,sans-serif;color:#c5b38e;margin-bottom:10px}.search-row{display:flex;gap:10px}.search input,dialog input{min-width:0;width:100%;background:#242a21;border:1px solid #807b56;border-radius:4px;padding:14px 15px;color:#e4d6b8;font:15px system-ui,sans-serif}.search input:focus,dialog input:focus{outline:2px solid #b29a67}.search button,dialog button[type=submit]{border:0;border-radius:4px;padding:0 22px;background:#806b48;color:#f5e8cb;font:600 13px system-ui,sans-serif;cursor:pointer;white-space:nowrap}.search button:hover,dialog button[type=submit]:hover{background:#978157}.section-heading h2{font-size:29px;font-weight:normal;margin:0 0 15px}.stations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.panel{background:#272c22df;border:1px solid #786c4eaa;border-radius:6px;padding:20px;min-width:0}.station h3{font-size:23px;font-weight:normal;margin:0 0 15px}.link-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.link-list a,.bookmark-grid a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:64px;padding:14px;color:var(--paper);background:#3b4432;border:1px solid #646a4d;border-radius:4px;text-decoration:none;font:600 14px system-ui,sans-serif;transition:background .15s,transform .15s}.link-list a:hover,.bookmark-grid a:hover{background:#515d41;transform:translateY(-2px)}.link-list a span{color:#c7ad7b}.extras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:15px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.panel-head h2{font-size:23px;font-weight:normal;margin:0}.small-btn{padding:9px 12px;background:#4b563c;border:1px solid #7d8058;border-radius:4px;color:var(--paper);cursor:pointer;font:12px system-ui,sans-serif}.small-btn:hover{background:#626d4c}.bookmark-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.bookmark-entry{display:flex;gap:5px;align-items:stretch}.bookmark-entry a{flex:1;min-width:0;overflow-wrap:anywhere}.bookmark-entry .delete{border:1px solid #736448;background:#3b3629;color:#e0cba4;border-radius:4px;cursor:pointer;padding:0 10px}.hint{color:var(--muted);font:11px/1.5 system-ui,sans-serif}.notes-panel{grid-column:1/-1}textarea{width:100%;min-height:160px;resize:vertical;background:#242a21;border:1px solid #747c58;color:var(--paper);border-radius:4px;padding:14px;font:14px/1.6 system-ui,sans-serif}.note-foot{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.activity-item{padding:10px 0;border-bottom:1px solid #77745655;font:13px/1.5 system-ui,sans-serif}.activity-item a,.profile-link{color:#d5c6a7}.activity-item time{display:block;font-size:11px;color:var(--muted)}.profile-link{display:inline-block;margin-top:14px;font:12px system-ui,sans-serif}dialog{background:#2b3227;color:var(--paper);border:1px solid #8d7b53;border-radius:7px;max-width:420px;width:90%;padding:24px}dialog::backdrop{background:#0b100cc9}dialog form{display:grid;gap:12px}dialog h2{margin:0 0 4px}dialog label{font:12px system-ui,sans-serif}#bookmarkError{color:#e6a893;font:12px system-ui,sans-serif;margin:0}.dialog-actions{display:flex;justify-content:flex-end;gap:10px}.dialog-actions button{min-height:40px}@media(max-width:760px){.hero{grid-template-columns:1fr}.art{min-height:230px;border-right:0;border-bottom:1px solid #87744f77}.stations,.extras{grid-template-columns:1fr}.notes-panel{grid-column:auto}.hero-right{padding:26px}.hero-mark{margin-bottom:16px}}@media(max-width:420px){.link-list,.bookmark-grid{grid-template-columns:1fr}.top h1{font-size:25px}.search-row{flex-direction:column}.search button{padding:14px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}


/* v4: storybook psychedelic detailing without compromising compact navigation */
body{background:radial-gradient(ellipse at 84% 5%,#50543a 0%,transparent 35%),radial-gradient(ellipse at 4% 60%,#58402d 0%,transparent 42%),linear-gradient(115deg,#3d3025,#303b2b 62%,#433629)}
.wrap:before,.wrap:after{content:"";position:absolute;pointer-events:none;z-index:-1;width:115px;height:660px;background:url('assets/mushroom-border.svg') center/contain no-repeat;opacity:.42}
.wrap:before{left:-102px;top:440px}.wrap:after{right:-102px;top:770px;transform:scaleX(-1)}
.top{border-bottom:2px solid #9c855b88}.top h1{font-style:italic;text-shadow:2px 3px 0 #151b1455}
.hero{min-height:236px;grid-template-columns:51% 49%;border:2px solid #9c7955;box-shadow:0 10px 0 #26271c70,0 18px 35px #151b1450}
.art{min-height:236px;background-image:url('assets/woodland.svg');background-position:center 53%}
.hero-right{background:radial-gradient(ellipse at 65% 20%,#52583c,transparent 70%),#343c2d}
.hero-mark{font-size:29px;margin-bottom:18px;letter-spacing:.25em}
.panel{position:relative;border-color:#88734e;border-radius:10px 8px 12px 9px;box-shadow:inset 0 0 0 1px #c2a77b16,0 4px 14px #151a1335}
.station:nth-child(5n+1){border-radius:11px 8px 10px 7px}.station:nth-child(5n+2){border-radius:7px 12px 8px 11px}
.station:before{content:"✿";position:absolute;right:17px;top:14px;color:#a68e62;opacity:.55;font-size:16px}
.station:nth-child(2n):before{content:"❧"}.station:nth-child(3n):before{content:"☾"}
.station h3,.panel-head h2,.section-heading h2{color:#e2c99b;letter-spacing:.01em}
.link-list a,.bookmark-grid a{border-color:#7d7955;background:linear-gradient(135deg,#46503a,#394231);border-radius:8px 6px 9px 7px;min-height:58px}
.link-list a:hover,.bookmark-grid a:hover{background:#5a6044;border-color:#b39b6a}
.section-heading h2:after{content:"  ❧  ✿";font-size:18px;color:#b39b6a;vertical-align:middle}
.notes-panel:after{content:"❦";position:absolute;right:21px;top:54px;color:#ab9368;opacity:.35;font-size:25px;pointer-events:none}
@media(max-width:760px){.hero{grid-template-columns:1fr}.art{min-height:240px}.wrap:before,.wrap:after{display:none}}

/* v5 Enchanted Forest: hand-painted layered night woodland */
body{
  background-color:#192b28;
  background-image:linear-gradient(90deg,rgba(18,25,20,.26),rgba(17,27,22,.18)),url("assets/night-forest.svg");
  background-size:cover;
  background-position:center top;
  background-attachment:fixed;
}
.grain{opacity:.035}
.wrap:before,.wrap:after{opacity:.65;z-index:0}
.wrap > *{position:relative;z-index:1}
.top{background:linear-gradient(90deg,rgba(23,32,26,.77),rgba(23,32,26,.46));border-radius:8px;padding:14px 18px;border:1px solid #987c4c8a}
.hero-right{background:linear-gradient(125deg,rgba(33,46,35,.97),rgba(48,56,39,.97))}
.panel{background:linear-gradient(130deg,rgba(26,37,30,.96),rgba(33,43,32,.94));border-color:#a08453;box-shadow:0 6px 22px #08110c8c,inset 0 0 0 1px #d4ae6b1a}
.link-list a,.bookmark-grid a{background:linear-gradient(130deg,#344436,#394635);border-color:#8c8059}
.link-list a:hover,.bookmark-grid a:hover{background:#4d6045}
.hero{box-shadow:0 12px 35px #08110bb3}
@media(max-width:760px){body{background-attachment:scroll;background-position:center top}}

/* iPhone and mobile Safari/Firefox finishing touches */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,input,textarea{font-size:16px;touch-action:manipulation}
@media(max-width:760px){
 .wrap{width:min(100% - 24px,540px);padding:12px 0 max(35px,env(safe-area-inset-bottom))}
 .top{padding:13px 16px}
 .top h1{font-size:clamp(25px,7vw,34px)}
 .hero{margin:14px 0 23px;min-height:0}
 .art{min-height:190px;background-position:center 55%}
 .hero-right{padding:23px 20px 26px}
 .hero-mark{font-size:24px;margin-bottom:15px}
 .panel{padding:17px}
 .link-list,.bookmark-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .link-list a,.bookmark-grid a{min-height:54px;padding:12px;font-size:13px}
 .station h3,.panel-head h2{font-size:21px}
 .section-heading h2{font-size:25px}
 .search-row{flex-direction:row}
 .search button{padding:0 16px}
}
@media(max-width:370px){
 .link-list,.bookmark-grid{grid-template-columns:1fr}
 .search-row{flex-direction:column}
 .search button{padding:13px}
}
