/* A fixed film surface lets sections move independently of their backdrop. */
:root { --rail-width: clamp(174px, 16vw, 220px); --icon-accent: #d37b68; }
body { background: #f7eee5; }
body::before { display: none; }
.film { position: fixed; inset: 0; isolation: isolate; z-index: -1; overflow: hidden; pointer-events: none;
  background: radial-gradient(ellipse at 64% 63%, #fff8f0 0%, #f8eee6 55%, #efe4e2 100%); }
.film::after { content: ''; position: absolute; inset: 0; background: url('/media/grain.webp') repeat;
  mix-blend-mode: multiply; opacity: .092; }
.orb { position: absolute; border-radius: 50%; aspect-ratio: 1; pointer-events: none;
  transition: transform 1.15s cubic-bezier(.19,.72,.19,1); will-change: transform; }
.orb-sun { width: clamp(260px,34vw,640px); top:-15%; right:-7%; filter: blur(11px); opacity:.89;
  background: radial-gradient(at 27% 83%,#ffe6a1,transparent 39%),radial-gradient(at 26% 48%,#ff962e 9%,transparent 54%),radial-gradient(at 77% 75%,#9c365c 8%,transparent 60%),radial-gradient(at 65% 19%,#592540,transparent 64%),#d14651; }
.orb-plum { width: clamp(290px,38vw,680px); right:-8%; bottom:-32%; filter: blur(15px); opacity:.8;
  background: radial-gradient(at 24% 23%,#ffbd91 2%,transparent 38%),radial-gradient(at 59% 14%,#cb6586,transparent 47%),radial-gradient(at 75% 65%,#442344 10%,transparent 58%),radial-gradient(at 18% 70%,#907689,transparent 55%),#ad788a; }
.orb-pearl { width: clamp(170px,20vw,350px); left:8%; bottom:-9%; filter: blur(12px); opacity:.66;
  background: radial-gradient(at 22% 26%,#fff7c3 8%,transparent 42%),radial-gradient(at 79% 72%,#af687f,transparent 55%),radial-gradient(at 22% 73%,#b2adbf,transparent 50%),#edbea4; }
body[data-scene="moje"] .orb-sun { transform:translate(8vw,-11vh) scale(.83); }
body[data-scene="moje"] .orb-plum { transform:translate(-27vw,14vh) scale(1.08); }
body[data-scene="moje"] .orb-pearl { transform:translate(-6vw,-32vh); }
body[data-scene="profil"] .orb-sun { transform:translate(-21vw,-16vh) scale(1.15); }
body[data-scene="profil"] .orb-plum { transform:translate(11vw,-20vh) scale(.89); }
body[data-scene="profil"] .orb-pearl { transform:translate(1vw,-11vh) scale(1.15); }
body[data-scene="sem"] .orb-sun { transform:translate(9vw,11vh) scale(.87); }
body[data-scene="sem"] .orb-plum { transform:translate(-8vw,7vh); }
body[data-scene="sem"] .orb-pearl { transform:translate(-10vw,-26vh); }
body[data-scene="tady"] .orb-sun { transform:translate(-18vw,-12vh) scale(.82); }
body[data-scene="tady"] .orb-plum { transform:translate(12vw,-21vh); }
body[data-scene="tady"] .orb-pearl { transform:translate(10vw,5vh) scale(1.13); }
.sidebar { position:fixed; inset:0 auto 0 0; z-index:4; width:var(--rail-width);
  background:linear-gradient(120deg,#faf2e8c4,#fcf3eb97 70%,#f8eee5ab); border-right:1px solid #a97f771f; }
.rail { display:grid; grid-template-rows:auto 1fr auto; height:100%; padding:clamp(25px,3.3vw,55px) 15px 27px; }
.rail .brand { place-self:start; margin-left:clamp(6px,1.2vw,23px); }
.rail .brand-wide {width:clamp(99px,8.2vw,125px); height:auto;}
.rail .brand-small,.nav-small {display:none;}
.rail-menu {align-self:center;display:grid;gap:7px; margin-bottom:8vh;}
.rail-link,.rail .profile-link { color:#5a3446; display:flex; align-items:center; gap:11px; min-height:46px;
  font:600 .96rem/1.2 var(--sans); text-decoration:none; padding:10px clamp(9px,1.1vw,20px);
  border:0; border-radius:13px; box-shadow:none; background:transparent; max-width:100%; justify-content:flex-start; }
.rail-link:hover,.rail .profile-link:hover {background:#fff5e3aa;color:var(--cherry);}
.rail [aria-current="page"] {background:#fff5e9e6;color:#571936;box-shadow:inset 0 1px 1px #fff,0 2px 7px #64284112;}
.rail .profile-link {align-self:end;font-size:.9rem;min-width:0;}
.rail .profile-link .avatar {width:32px;--icon-accent:#ffb56b;}
.rail .profile-link span:last-child {overflow:hidden;text-overflow:ellipsis;}
#main {margin-left:var(--rail-width); min-height:100vh; min-height:100svh; display:flow-root; }
.home,.work,.work:has(.project-grid) {width:min(1056px,calc(100% - clamp(56px,7vw,120px)));margin:clamp(55px,10vh,110px) auto 60px;}
.work {max-width:720px;}
.history-view {max-width:none;}
.intro {margin-bottom:clamp(30px,5vh,52px);}
.intro h1 {font-size:clamp(2.8rem,5.15vw,5.3rem);font-weight:540;}
.choices {gap:clamp(13px,1.5vw,24px); align-items:stretch;}
.choice {container-type:inline-size; position:relative; isolation:isolate; overflow:hidden; border-radius:24px;
  min-height:clamp(275px,24vw,340px); padding:clamp(19px,2.2vw,34px); border:none;
  box-shadow: inset 0 1px 1px #fff7,0 5px 6px -4px #63142b30,0 18px 36px -20px #531b3b6b;
  background:linear-gradient(133deg,#461532,#672040 53%,#963454); --ink:#fff3e6;
}
.choice.send {background:linear-gradient(128deg,#ffe2ba,#ffd49f 49%,#f4b184);--ink:#46172f;}
.choice::before {content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background:url('/media/grain.webp');mix-blend-mode:soft-light;opacity:.15;}
.choice .stage {inset:0;width:100%;overflow:hidden;z-index:-1;}
.cut-shape,.fold {position:absolute;display:block;}
.receive .cut-shape {width:84%;height:148%;right:-30%;top:-39%;border-radius:48% 7% 42% 60%;transform:rotate(32deg);background:linear-gradient(111deg,#ed7081,#bc3d60 73%);}
.receive .fold {bottom:-64%;right:-11%;width:67%;height:121%;border-radius:50%;background:linear-gradient(150deg,#822c51 5%,#581d42 55%);transform:rotate(32deg);}
.send .cut-shape {width:86%;height:122%;right:-29%;bottom:-15%;border-radius:84% 14% 11% 15%;transform:rotate(12deg);background:linear-gradient(130deg,#f4a477 9%,#dc7d77 65%);}
.send .fold {height:99%;width:46%;right:-20%;top:-32%;border-radius:50%;transform:rotate(-30deg);background:linear-gradient(135deg,#aa5361,#8e3e5a);}
.choice .stage img {inset:13% .5% auto auto;width:49%;height:71%;max-width:none;filter:drop-shadow(5px 11px 6px #411a3a3d);transition:transform .32s ease;}
.send .stage img {inset:13% .6% auto auto;}
.choice .choice-content {position:relative;z-index:1;display:grid;grid-template-rows:auto 1fr auto;justify-items:start;align-items:start;}
.choice .phrase {font-size:clamp(.86rem,1.1vw,1.04rem);color:var(--ink);font-weight:550;}
.choice .choice-name {font-size:clamp(3.1rem,5.35vw,5.5rem);line-height:1.04;letter-spacing:-.077em;margin:12px 0 18px;font-weight:570;}
.receive .choice-name>span {color:#ffb26d;}
.send .choice-name>span {color:#a7355b;}
.choice .choice-action {display:inline-flex;align-items:center;justify-content:flex-start;gap:9px;min-height:43px;padding:9px 15px 9px 12px;
  border:0;border-radius:12px; align-self:end;background:#ffedda;color:#4d1733;font-weight:710;font-size:.96rem;--icon-accent:#b64261;
  box-shadow:0 2px 4px #53172f18,inset 0 1px 0 #fff7;}
.send .choice-action {background:#50213c;color:#fff3df;--icon-accent:#ffae73;}
.choice-action .ico {width:23px;height:23px;}
.choice:hover .choice-action {box-shadow:0 3px 8px #44152d24,inset 0 1px 0 #fff7;}
.project-card {position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(115deg,#fff9f0,#fff0e6);}
.project-card::before {content:'';position:absolute;width:65%;height:180px;right:-22%;top:-120px;border-radius:65%;transform:rotate(-26deg);z-index:-1;background:linear-gradient(125deg,#f1c9cb,#e5a6ad);}
.project-card[data-kind="tady"]::before {background:linear-gradient(125deg,#ffdfb2,#f4bc95);}
.project-kind::before {display:none;}
.project-kind svg {width:24px;height:24px;}
.card-actions,.dialog-actions {display:flex;align-items:center;flex-wrap:wrap;gap:8px;}
.project-bottom {align-items:center;}
.trash-button {display:inline-flex;align-items:center;gap:5px;padding:9px 6px;border:0;background:none;font-size:.84rem;font-weight:620;color:#87324a;min-height:42px;}
.trash-button .ico {width:18px;height:18px;}
.trash-button:hover {text-decoration:underline;}
[data-extend]:disabled {opacity:1;color:#745a60;background:#f1e5db;border-color:#d4c2b6;cursor:default;}
[data-extend]:disabled .ico {width:16px;height:16px;}
.remove-dialog {width:min(410px,calc(100% - 40px));border:1px solid #cfb7a8;border-radius:22px;background:#fff6e9;color:var(--cherry);padding:27px;box-shadow:0 16px 70px #370d2444;}
.remove-dialog h2 {font:580 1.4rem/1.25 var(--wide);letter-spacing:-.045em;}
.remove-dialog p {margin:12px 0 18px;overflow-wrap:anywhere;}
.remove-dialog .share-status:empty {display:none;}
.remove-dialog::backdrop {background:#38182b62;backdrop-filter:blur(4px);}
.dialog-actions {justify-content:flex-end;}
.danger {display:inline-flex;align-items:center;gap:6px;background:#852445;color:#fff3e4;border:0;border-radius:10px;padding:10px 14px;font-weight:660;min-height:42px;--icon-accent:#ffc2a2;}
.danger .ico {width:18px;height:18px;}
@media(max-width:980px) {
  :root{--rail-width:132px;}
  .rail{padding-inline:6px}.rail-link,.rail .profile-link{gap:6px;font-size:.83rem;}
  .home,.work,.work:has(.project-grid){width:calc(100% - 46px);}
  .choice {min-height:236px;padding:19px;}
  .choice .choice-action{font-size:.85rem;gap:6px;padding:8px 10px;}
  .choice .choice-name{font-size:clamp(2.7rem,5.4vw,3.5rem);}
  .choice .stage img{width:44%;right:0;}
}
@media(max-width:760px){
  :root{--rail-width:65px;}
  .rail{padding:18px 4px max(16px,env(safe-area-inset-bottom));}
  .rail .brand{margin:0;place-self:start center;padding:2px;}
  .rail .brand-wide,.nav-wide{display:none;}
  .rail .brand-small{display:block;width:39px;height:39px;}
  .rail-menu{margin:0;gap:10px;}
  .rail-link,.rail .profile-link{flex-direction:column;align-items:center;justify-content:center;min-height:48px;padding:6px 2px;gap:2px;font:650 10px/1.35 var(--sans);max-width:100%;}
  .rail .rail-link .ico{width:23px;height:23px;}
  .nav-small{display:block;}
  .rail .profile-link .avatar{width:26px;}
  .rail .profile-link span:last-child {display:block;max-width:100%;white-space:nowrap;}
  .orb-sun{right:-27%;top:-12%;} .orb-plum{right:-31%;bottom:-16%;} .orb-pearl{left:-21%;bottom:10%;}
  .home,.work,.work:has(.project-grid){margin:36px auto 40px;width:calc(100% - 36px);}
  .intro h1 {font-size:clamp(2.1rem,6.8vw,3rem);}
  .choices{grid-template-columns:1fr;gap:14px;}
  .choice {min-height:193px;grid-template-columns:1fr;padding:20px;border-radius:18px;}
  .choice .stage{width:100%;}
  .choice .stage img{inset:7% 1% auto auto;height:79%;width:46%;}
  .choice .choice-name{font-size:clamp(2.7rem,7.1vw,3.4rem);margin:5px 0 14px;}
  .choice .choice-action{font-size:.85rem;}
  .project-grid{grid-template-columns:1fr;}
  .project-bottom{align-items:flex-start;gap:6px;}
  .card-actions{gap:4px;}
}
@media(max-width:430px){
  :root{--rail-width:54px;}
  .home,.work,.work:has(.project-grid){width:calc(100% - 24px);}
  .intro{margin-bottom:20px;}
  .intro h1{font-size:clamp(1.7rem,6.7vw,2.05rem);}
  .choice{min-height:172px;padding:15px;}
  .choice .phrase{font-size:.78rem;}
  .choice .stage img{inset:13% -2% auto auto;width:47%;height:67%;}
  .choice .choice-name{font-size:2.7rem;}
  .choice .choice-action{font-size:.8rem;min-height:36px;padding:6px 9px;}
  .choice .choice-action svg{width:19px;height:19px;}
  .file-row{flex-wrap:wrap;}.file-info{min-width:70px;}
  .project-files .file-row{gap:6px;}
  .work h1{font-size:clamp(1.55rem,6vw,2rem);}
}
@media(prefers-reduced-motion:reduce) {
  .orb {transition:none;will-change:auto;}
}
@supports (view-transition-name: none) {
  :root { view-transition-name:none; }
  #main > section { view-transition-name:section-content; }
  ::view-transition-group(section-content) {animation-duration:.3s;animation-timing-function:cubic-bezier(.22,.7,.28,1);}
  ::view-transition-old(section-content) {animation:section-out .16s ease-out both;}
  ::view-transition-new(section-content) {animation:section-in .28s cubic-bezier(.22,.7,.28,1) both;}
}
@keyframes section-out {to {opacity:0;transform:translateY(-4px);}}
@keyframes section-in {from {opacity:0;transform:translateY(7px);}}
.more > summary {display:flex;align-items:center;gap:7px;list-style:none;}
.more > summary::-webkit-details-marker {display:none;}
.more > summary .ico {width:15px;height:15px;}
.more[open] > summary .ico {transform:rotate(180deg);}