body{background:#12150f}#app{background:repeating-linear-gradient(42deg,#ffffff02 0 1px,transparent 1px 3px),radial-gradient(ellipse at 30% 20%,#2c3025,#12150f 80%)}.folio-header{display:flex;align-items:center;justify-content:space-between;padding:25px 25px 32px}.folio-header .brand{text-align:left}.folio-header .brand>span{font-size:clamp(3.5rem,16vw,6rem);font-weight:600;letter-spacing:-.06em;color:#d2aa71}.folio-header .brand small{font-size:9px;letter-spacing:.45em;margin-left:4px}.folio-header>.icon-button{width:50px;height:50px}.folio-header>.icon-button .icon{width:33px;height:33px}.binder{position:relative;margin:0 14px;border:1px solid #b89b65;border-radius:22px;padding:8px 40px 12px 7px;background:linear-gradient(100deg,#3f3420,#887046 4%,#30271a 6%,#1c1a12 92%,#8f7141 95%,#342513 97%);box-shadow:inset 0 0 0 3px #2a1e10,inset 0 0 0 5px #91703d66,0 7px 20px #0009}.binder-tabs{position:absolute;right:-6px;top:14px;bottom:58px;width:46px;display:flex;flex-direction:column;justify-content:space-between;gap:5px;z-index:1}.binder-tabs button{flex:1;background:linear-gradient(90deg,#a08c6b,#d4c6a8);color:#2c281f;border:1px solid #baa67f;border-radius:0 14px 14px 0;box-shadow:4px 3px 5px #0008;writing-mode:vertical-rl;text-orientation:mixed;font-size:13px;letter-spacing:.12em;padding:11px 10px;min-height:62px;max-height:95px}.binder-tabs button[aria-pressed=true]{background:linear-gradient(90deg,#4a1713,#722922);color:#e8d3b4;border-color:#af7c53;transform:translateX(2px)}.paper-stack{position:relative;z-index:2;min-width:0;perspective:900px}.paper{position:relative;isolation:isolate;background:radial-gradient(ellipse at 25% 25%,#f4ead7,#d7c7a6);border:1px solid #dcd0b7;border-radius:15px;box-shadow:inset 0 0 25px #a7906444,2px 9px 9px #0007;overflow:hidden;color:#191b12;border-left:8px solid var(--tab-color)}.paper:before{content:'';position:absolute;z-index:-1;left:41px;top:0;bottom:0;width:1px;background:#9e534f55}.top-paper{padding:15px 20px 20px 47px;transform:translateX(var(--swipe,0px)) rotate(-.8deg);transform-origin:left top;touch-action:pan-y;transition:transform .2s;z-index:5;min-height:385px;margin-bottom:-8px}.binder-hole{position:absolute;left:9px;top:22px;width:23px;height:23px;border:3px solid #c5a670;box-shadow:0 0 0 1px #5a3516,0 2px 4px #0009,inset 0 1px 4px #000;background:radial-gradient(#0e100b 40%,#55482d);border-radius:50%}.paper-heading{display:flex;justify-content:space-between;font:10px/1.7 Arial,sans-serif;letter-spacing:.15em;border-bottom:1px solid #9d605755;padding-bottom:15px;margin-bottom:21px;gap:8px;color:#463c2d}.paper-heading>span:last-child{text-align:right}.paper-heading small{font-size:7px;letter-spacing:.08em}.top-paper h1{font-size:clamp(2.1rem,9.9vw,4.65rem);line-height:1.03;letter-spacing:-.045em;max-width:12ch;margin:0 0 20px;font-weight:500}.top-paper>p{border-top:1px solid #904b4055;padding-top:15px;font-size:clamp(1.05rem,4.5vw,1.8rem);line-height:1.2;margin-bottom:20px}.paper-action{display:flex;align-items:center;gap:10px}.paper-action .primary{flex:1;min-width:0;border-radius:9px;font-size:clamp(1.25rem,5vw,2.2rem);padding:12px 15px;min-height:57px;color:#e9d7b6;background:linear-gradient(135deg,#62221a,#3a100d);border:2px solid #866532;box-shadow:0 0 0 1px #d6bd87,inset 0 0 0 2px #a2834d55,0 5px 7px #33210e55}.paper-save{border:1px solid #8c7958;border-radius:6px;color:#58432b;min-width:43px;min-height:57px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;font:10px Arial,sans-serif;padding:5px}.paper-save .icon{width:21px;height:21px}.paper-note{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font:10px/1.5 Arial,sans-serif;color:#645238;margin-top:17px}.paper-note .icon{width:17px;height:17px}.paper-note>span{display:block;margin-left:auto;color:#716449}.folded-paper{padding:18px 14px 14px 45px;min-height:72px;margin:0 calc(var(--level)*2px) -5px;z-index:calc(5 - var(--level));background:linear-gradient(#baaa8d,#e0d2b8 26%,#d6c5a5);transform:rotate(calc(var(--level)*.3deg))}.folded-paper .binder-hole{top:25px}.folded-paper>button{display:flex;align-items:center;gap:10px;text-align:left;padding:0;min-height:44px;width:100%;color:#27271d}.folded-paper small{font:10px Arial,sans-serif;color:#5c4d37;align-self:flex-start;margin-top:5px}.folded-paper h2{font-size:clamp(1.2rem,4.9vw,2.2rem);line-height:1.03;margin:0;flex:1;letter-spacing:-.025em}.folded-paper button>.icon{width:16px;height:16px;color:#6a5434}.folio-controls{display:flex;justify-content:space-between;align-items:center;margin:17px 10px 0 22px;color:#ddc89f;font:12px Arial,sans-serif;gap:12px}.folio-controls button{min-height:44px;min-width:44px;display:grid;place-items:center}.folio-hint{font:12px Arial,sans-serif;color:#b9a584;text-align:center;padding:23px 15px}.dock{background:repeating-linear-gradient(45deg,#fff1 0 1px,transparent 1px 3px),#1b1e15}.dock button{font-family:Georgia,serif;font-style:italic;font-size:16px}.dock button .icon{width:25px;height:25px}.top-paper [aria-pressed=true] .icon{fill:#85613755;stroke:#674321}@media(min-width:600px){.folio-header{padding:35px 40px}.binder{margin:0 30px;padding-right:60px}.binder-tabs{width:62px;right:-8px}.binder-tabs button{font-size:18px;max-height:130px}.top-paper{padding:25px 35px 28px 72px;min-height:490px}.paper:before{left:63px}.binder-hole{left:18px;width:29px;height:29px}.paper-heading{font-size:13px}.paper-heading small{font-size:9px}.paper-note{font-size:12px}.folded-paper{padding:25px 25px 20px 65px;min-height:98px}.folded-paper small{font-size:13px}.paper-save{min-width:62px;min-height:68px;font-size:12px}.paper-save .icon{width:26px;height:26px}}