/* The shell never scrolls. Only the story can scroll vertically. */
html,body.about-body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
[hidden]{display:none!important}
.about-app{height:100dvh;width:100%;max-width:100vw;overflow:hidden;padding:0;display:flex;flex-direction:column;background:radial-gradient(ellipse at 85% 10%,#e0e7e8,transparent 50%),linear-gradient(125deg,#f6f3ec,#eaeff1);isolation:isolate}
.about-header{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 32px;border-bottom:1px solid #243b4812}
.header-caption{font-size:12px;color:#667976;letter-spacing:.08em}.home-link{font-size:13px;text-decoration:none;color:#516863}
.owner-bar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 24px;background:#ffffff90;border-bottom:1px solid #243b4812}
.owner-actions,.creation-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}.publication-status{font-size:12px;color:#597068;display:flex;align-items:center;gap:8px}.publication-status:before{content:'';height:6px;width:6px;background:#b09366;border-radius:50%;flex:none}
.about-app button,.link-dialog button{border:1px solid #405b531a;background:#ffffff80;color:#2c4740;border-radius:9px;padding:9px 12px;font-size:12px;cursor:pointer;max-width:100%;transition:background .15s}
.about-app button:hover,.link-dialog button:hover{background:#dce7df}.about-app .dark-button,.link-dialog .dark-button{color:#fff;background:#28483f}.about-app button:disabled{opacity:.4;cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #487965;outline-offset:3px}
.creation-bar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 24px;background:#f7faf6}.creation-bar>span{font-size:11px;color:#6a7b72}.creation-bar button{background:transparent}
#notice:empty{display:none}#notice{flex:none;margin:0;padding:8px 24px;font-size:12px;background:#f9eed8;color:#675034;overflow-wrap:anywhere}
.about-workspace{flex:1;min-height:0;min-width:0;width:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bfcac1 transparent;padding:0 22px 24px}
#placeholder{margin:clamp(24px,10vh,120px) auto 0;width:min(650px,100%);background:#ffffff70;border:1px solid #ffffffa0;box-shadow:0 24px 80px #5264520b}.placeholder-actions{display:flex;gap:10px;flex-wrap:wrap}
#biography{position:relative;max-width:1160px;width:100%;min-width:0;margin:26px auto 0;isolation:isolate;min-height:650px}
.story-paper{position:absolute;inset:0 6%;border-radius:6px;background:linear-gradient(115deg,#fffdf8,#f8f8f1);box-shadow:0 20px 60px #334b3a0a;z-index:-1;pointer-events:none}
.story-eyebrow{position:absolute;top:38px;left:11%;font-size:9px;letter-spacing:.18em;color:#78887e;pointer-events:none}
.story-text{position:absolute;left:0;width:100%;margin:0;outline:none;font-weight:350;letter-spacing:-.018em;white-space:pre;overflow-wrap:normal;color:#283f37;z-index:2;min-height:1px}
.story-text .text-line{position:absolute;display:block;white-space:pre;max-width:100%;letter-spacing:normal}
.story-text[data-field=name]{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.035em}
.story-text[data-field=subtitle]{color:#748477}.story-text[data-field=intro]{color:#435b50}.story-text[data-field^=block]{color:#435b50}
.story-text[contenteditable=true] .text-line{cursor:text;border-radius:3px}.story-text[contenteditable=true]:hover .text-line{background:#6e91660a}.story-text[contenteditable=true]:focus .text-line{background:#7f9e6e0c}.story-text.is-empty .text-line{color:#98a695;font-weight:300;font-style:italic}
.story-text .text-line.placeholder-line:before{content:attr(data-placeholder);pointer-events:none}
#mediaLayer{position:absolute;inset:0;pointer-events:none;z-index:4}
.story-media{position:absolute;margin:0;pointer-events:auto;transform:rotate(var(--angle));transform-origin:center;outline:none;touch-action:pan-y;filter:drop-shadow(0 14px 14px #233e3926);cursor:zoom-in;border:6px solid #fffdf7;border-radius:4px;background:#eff0e6}
.story-media img,.story-media video{display:block;width:100%;height:100%;object-fit:cover;border-radius:1px;pointer-events:none;user-select:none;-webkit-user-drag:none}
.story-media.is-editable{cursor:grab;touch-action:none}.story-media.is-editable:active{cursor:grabbing}.story-media.selected{outline:2px solid #557b66;outline-offset:5px;z-index:10}
.story-media figcaption{position:absolute;left:0;right:0;bottom:0;padding:7px 9px;background:#fffefaed;color:#4b6254;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.video-badge{position:absolute;inset:0;display:grid;place-content:center;color:#fff;font-size:30px;text-shadow:0 2px 12px #000;pointer-events:none}
.about-app .media-handle{position:absolute;padding:0;width:20px;height:20px;border:2px solid #557b66;background:#fff;border-radius:50%;z-index:12;touch-action:none}.media-handle.resize{right:-13px;bottom:-13px;cursor:nwse-resize}.media-handle.rotate{left:calc(50% - 10px);top:-38px;cursor:grab}.media-handle.rotate:after{content:'';position:absolute;width:1px;height:17px;background:#557b66;top:18px;left:7px}
#emptyMediaHint{position:absolute;right:12%;top:230px;width:28%;aspect-ratio:4/5;transform:rotate(5deg);border:1px dashed #99ab94;border-radius:4px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:26px;background:#eaf0e344;color:#7d9076;font-family:Georgia,serif;font-size:clamp(20px,3vw,34px);text-align:center;z-index:3}#emptyMediaHint button{font-family:Arial,sans-serif;font-size:11px}
.media-tools{flex:none;padding:9px 18px;display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;background:#f9fbf7;border-top:1px solid #405b5320;min-width:0}.media-tools>span{font-size:12px;font-weight:500}.media-tools label{display:flex;align-items:center;gap:8px;font-size:11px}.media-tools input{width:100px;max-width:20vw;accent-color:#557b66}.media-tools output{min-width:28px;font-variant-numeric:tabular-nums}
.link-dialog{width:min(440px,calc(100vw - 32px));border:1px solid #d7e1d4;border-radius:20px;padding:26px;color:#2c4740;background:#f8faf5}.link-dialog label{display:grid;gap:8px;font-size:13px;margin:18px 0}.link-dialog input,.link-dialog select{width:100%;padding:12px;border:1px solid #bccdbb;border-radius:8px;font:inherit;background:white}.link-dialog form>div{display:flex;justify-content:flex-end;gap:10px}
dialog::backdrop{background:#17251dde;backdrop-filter:blur(10px)}
.lightbox{border:0;background:transparent;color:white;padding:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;overflow:hidden}
.lightbox[open]{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px}.lightbox #closeLightbox{position:absolute;right:22px;top:20px;width:42px;height:42px;border:1px solid #ffffff60;background:#ffffff20;color:white;border-radius:50%;font-size:19px;cursor:pointer;z-index:1}
#lightboxContent{display:flex;align-items:center;justify-content:center;width:calc(100% - 48px);height:calc(100% - 120px)}#lightboxContent img,#lightboxContent video{max-width:100%;max-height:100%;object-fit:contain;transform:none;border-radius:3px;box-shadow:0 25px 90px #0005}#lightboxCaption{margin:0;max-width:85vw;font-size:13px;text-align:center;overflow-wrap:anywhere}
@media(max-width:700px){.about-header{padding:12px 16px}.header-caption{display:none}.owner-bar{padding:8px 12px;align-items:flex-start;flex-direction:column;gap:7px}.owner-actions{gap:4px}.about-app button{padding:8px 9px;font-size:11px}.creation-bar{padding:6px 12px}.creation-bar>span{display:none}.about-workspace{padding:0 6px 16px}#biography{margin-top:14px}.story-paper{inset:0 2%;}.story-eyebrow{left:7%;top:25px;font-size:7px;letter-spacing:.1em}.story-media{border-width:4px}.media-tools{padding:7px;gap:8px}.media-tools label{gap:4px}.media-tools input{width:64px}#emptyMediaHint{top:200px;right:8%;width:35%;font-size:19px;gap:12px}#emptyMediaHint button{font-size:9px;padding:5px}#placeholder{padding:26px 20px}.about-card h1{font-size:clamp(38px,10vw,60px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
#lightboxCaption{position:absolute;bottom:24px;left:7.5%;right:7.5%}
#biography{min-height:0}
#emptyMediaHint{top:140px;width:22%;aspect-ratio:1}
.about-app .text-grip{position:absolute;z-index:3;padding:2px;width:22px;height:30px;color:#7c937d;background:transparent;border:0;cursor:grab;touch-action:none;font-size:21px;opacity:.45}.about-app .text-grip:hover,.about-app .text-grip.dragging{opacity:1;background:#e6eddf}.about-app .text-grip.dragging{cursor:grabbing}
@media(max-width:700px){#emptyMediaHint{top:145px;right:8%;width:30%}.about-app .text-grip{font-size:17px;width:20px}}