.nav-wrap{display:flex;align-items:center;gap:28px}
.account{display:flex;align-items:center;gap:18px;font-family:var(--font-ui);font-size:.85rem}
.account a{text-decoration:none;color:var(--green)}
.account a.login-pill,.account button.login-pill{color:#f6f3e9}
.account form{margin:0}
.login-pill,button.login-pill{display:inline-block;background:var(--green);color:#f6f3e9;text-decoration:none;border:0;border-radius:999px;padding:8px 16px;font-family:var(--font-ui);font-size:.85rem;cursor:pointer}
.login-pill:hover,button.login-pill:hover{color:#f6f3e9}
.flash{max-width:1040px;margin:18px auto 0;padding:0 40px;color:var(--green)}
.filters{display:flex;gap:18px;font-family:var(--font-ui);font-size:.85rem}
.filters a{text-decoration:none}
.filters a[aria-current]{text-decoration:underline}
#reading .topic-card{min-height:240px;display:flex;flex-direction:column;justify-content:center}
.write-form{max-width:720px;display:flex;flex-direction:column;gap:16px;padding-bottom:70px}
.write-form.narrow{max-width:420px}
.write-form label{display:flex;flex-direction:column;gap:6px;font-family:var(--font-ui);font-size:.85rem;color:var(--muted)}
.write-form input,.write-form textarea,.write-form select{font:inherit;color:var(--ink);background:#fffdf8;border:1px solid var(--rule);border-radius:8px;padding:10px 12px}
.write-form textarea{min-height:110px;resize:vertical}
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.write-actions{display:flex;gap:12px;align-items:center}
.page-save{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;gap:12px;padding:12px 20px;background:var(--paper);border-top:1px solid var(--rule);z-index:5}
.page-save button{font-family:var(--font-ui);background:var(--green);color:#f6f3e9;border:0;border-radius:999px;padding:8px 16px;cursor:pointer}
.page-save button.secondary{background:transparent;color:var(--green);border:1px solid var(--green)}
.page-save-spacer{height:72px}
.write-actions button,.owner-tools button,.comment-form button,.manage-list button,.order-row button{font-family:var(--font-ui);background:var(--green);color:#f6f3e9;border:0;border-radius:999px;padding:8px 16px;cursor:pointer}
.write-actions .secondary,.write-actions a{background:transparent;color:var(--green);border:1px solid var(--green);text-decoration:none;border-radius:999px;padding:8px 16px}
.preview-banner{background:#efe6cf;color:var(--ink);padding:12px 16px;border-radius:8px;margin-top:24px}
.owner-tools{max-width:720px;margin:0 auto 24px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;font-size:.9rem}
.owner-tools form{margin:0}
.reactions{max-width:720px;margin:10px auto 40px;display:flex;gap:18px;align-items:center;font-family:var(--font-ui);font-size:.9rem;border-top:1px solid var(--rule);padding-top:18px}
.reactions form{margin:0}
.reactions button{font:inherit;background:transparent;border:1px solid var(--rule);border-radius:999px;padding:6px 12px;cursor:pointer;color:var(--ink)}
.reactions button[aria-pressed="true"]{border-color:var(--green);color:var(--green)}
.comments{max-width:720px;margin:0 auto 70px}
.comments ol{list-style:none;padding:0}
.comments li{border-bottom:1px solid var(--rule);padding:14px 0}
.comment-form{display:flex;flex-direction:column;gap:12px;margin-top:18px}
.comment-form input,.comment-form textarea{font:inherit;border:1px solid var(--rule);border-radius:8px;padding:10px 12px;background:#fffdf8}
.manage-list{list-style:none;padding:0 0 70px;max-width:720px}
.manage-list li{display:flex;justify-content:space-between;gap:16px;align-items:center;border-bottom:1px solid var(--rule);padding:16px 0}
.visibility{display:flex;gap:8px;margin:0;flex:none}
.manage-list .visibility button{background:transparent;color:var(--green);border:1px solid var(--green);border-radius:999px;padding:6px 12px}
.manage-list .visibility button[aria-pressed="true"]{background:var(--green);color:#f6f3e9}
.order-list{max-width:720px;padding-bottom:80px}
.order-row{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--rule)}
.order-row form{margin:0}
.ql-toolbar.ql-snow,.ql-container.ql-snow{border-color:var(--rule);font-family:var(--font-body)}
.ql-editor{min-height:280px;font-size:1.05rem;line-height:1.9}
.ql-editor img,.prose img,.album-shot{max-width:100%;height:auto}
.prose audio,.prose video,.entry audio,.entry video{display:block;width:100%;max-width:720px;margin:14px 0}
.prose figure{margin:14px 0}
.yt-play{font-family:var(--font-ui);background:var(--green);color:#f6f3e9;border:0;border-radius:999px;padding:8px 16px;cursor:pointer}
.yt-frame{aspect-ratio:16/9;max-width:720px;margin:14px 0;background:#111}
.yt-frame iframe{width:100%;height:100%;border:0}
.topic-fallback{display:flex;align-items:center;justify-content:center;background:#efe6cf;color:var(--green);font-family:var(--font-display)}
#album-list{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:12px}
#album-list li{width:140px}
#album-list img{width:100%;height:90px;object-fit:cover;display:block}
.theme-delete button{font-family:var(--font-ui);background:transparent;color:var(--green);border:1px solid var(--green);border-radius:999px;padding:6px 12px;cursor:pointer;margin-top:6px}
.editor-shot{position:relative}
.editor-shot.about-figure,.editor-shot.topic-art,.write-form .editor-shot.about-figure{display:block}
.editor-shot > .shot-x,.shot-x.is-on{position:absolute;top:8px;right:8px;z-index:4;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:50%;background:#34392f;color:#f6f3e9;font:18px/28px var(--font-ui);text-align:center;cursor:pointer;opacity:0;pointer-events:none}
.editor-shot:hover > .shot-x,.editor-shot:focus-within > .shot-x,.shot-x.is-on{opacity:1;pointer-events:auto}
.shot-x.is-on{position:fixed}
.prose-shot{display:inline-block;max-width:100%}
.prose-shot img{display:block;max-width:100%;height:auto}
.brand-shot,.footer-shot{display:inline-block;vertical-align:middle}
#album-list .editor-shot{width:140px}
.theme-delete{max-width:720px;padding:12px 0;border-bottom:1px solid var(--rule)}
.intro{padding:0;margin-bottom:2cm}
.intro + .topics{margin-top:0}
.intro.has-watermark{position:relative;max-width:none;overflow:hidden;height:calc(100vh - 106px)}
.intro.has-watermark .intro-mark{position:absolute;inset:0;z-index:0;pointer-events:none;display:flex;align-items:center;justify-content:center}
.intro.has-watermark .intro-mark::after{content:none}
.intro.has-watermark .intro-mark img{position:relative;display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;object-position:center center;opacity:.3;mix-blend-mode:multiply;-webkit-mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent);mask-composite:intersect}
.intro.has-watermark .intro-mark img.far-lamp{opacity:1;mix-blend-mode:normal;-webkit-mask-image:none;mask-image:none}
.intro.has-watermark .intro-copy{position:absolute;inset:0;z-index:1;max-width:none;display:flex;align-items:center;justify-content:center;text-align:center;padding:48px 24px}
.intro-figure{position:relative;z-index:2;width:min(250px,100%);height:156px;margin:0 auto 16px}
.intro-figure img{display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center center;mix-blend-mode:multiply;-webkit-mask-image:radial-gradient(ellipse at center,#000 48%,transparent 78%);mask-image:radial-gradient(ellipse at center,#000 48%,transparent 78%)}
.intro-text .lead{font-size:calc(1.35rem * 2 / 3 * 4 / 3)}
.intro-text .intro-note{margin-top:8px}
.page-intro h1{font-size:calc(2.3rem * 2 / 3)}
.page-intro.keep-title h1{font-size:2.3rem}
.topic-heading h1{font-size:calc(2rem * 2 / 3)}
.about-copy{margin-left:0;margin-right:0}
@media(max-width:650px){
  .topic-heading h1{font-size:calc(1.7rem * 2 / 3)}
  .page-intro.keep-title h1{font-size:2.3rem}
}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.topic-card.has-watermark{position:relative;overflow:hidden;min-height:240px;display:flex;flex-direction:column;justify-content:center}
.topic-card.has-watermark .topic-art{position:absolute;inset:0;z-index:0;margin:0;aspect-ratio:auto;max-width:none;pointer-events:none}
.topic-card.has-watermark .topic-art img{width:100%;height:100%;object-fit:cover;opacity:.34;mix-blend-mode:multiply}
.topic-card.has-watermark h3,.topic-card.has-watermark p{position:relative;z-index:1}
.about-figure{max-width:720px;margin:0 auto 18px}
.write-form .about-figure{max-width:240px;margin:0 0 12px}
.about-figure img{max-width:100%;height:auto;display:block}
.brand-logo,.footer-logo{height:42px;width:auto;display:block}
footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-content:stretch}
footer .footer-note{grid-column:2;text-align:center}
footer .footer-logo,footer .footer-shot{grid-column:3;justify-self:end}
.footer-edit{display:grid;grid-template-columns:1fr minmax(200px,320px) minmax(180px,240px);gap:12px 24px;align-items:start}
.footer-edit legend{grid-column:1 / -1}
.footer-edit-audio{grid-column:1;display:flex;flex-direction:column;gap:12px}
.footer-edit-text{grid-column:2;width:100%}
.footer-edit-image{grid-column:3}
.footer-edit-image .about-figure{margin-bottom:8px}
@media(max-width:650px){
  .footer-edit{grid-template-columns:1fr}
  .footer-edit-audio,.footer-edit-text,.footer-edit-image{grid-column:1}
}
.brand-logo{height:calc(56px * 1.6 * 423 / 536)}
.brand{align-items:center;color:var(--green);cursor:default}
header{padding-top:20px;padding-bottom:14px}
.write-form label.check{flex-direction:row;align-items:center;gap:8px}
fieldset{border:1px solid var(--rule);border-radius:8px;margin:0;padding:12px}
legend{font-family:var(--font-ui);color:var(--green)}
@media(max-width:650px){
  .intro.has-watermark{height:calc(100vh - 164px)}
  .nav-wrap{width:100%;justify-content:space-between;flex-wrap:wrap}
  .flash{padding-left:23px;padding-right:23px}
  .split{grid-template-columns:1fr}
  .manage-list li{flex-direction:column;align-items:flex-start}
}