*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#15171c;color:#edebe6;font:13px/1.5 system-ui,sans-serif}.demo{height:100svh;display:flex;flex-direction:column;max-width:420px;margin:auto}.screen{position:relative;flex:1;min-height:0;overflow:auto;scrollbar-width:none}.appbar,.reading header{display:flex;align-items:center;gap:10px;height:47px;padding:0 12px;border-bottom:1px solid #293248;background:#1c1f26}.appbar>span:first-child{font-size:26px;color:#c1bfb9}.appbar b{font-size:12px;flex:1}.exposure{font-size:10px;padding:5px 7px;border:1px solid #293248;border-radius:6px;color:#d4a94a}.theme{padding:17px 14px 8px}.theme small,.reading-content>small{color:#8f9298;font-size:9px;letter-spacing:.09em}.theme h1{font-size:19px;line-height:1.35;margin:5px 0 8px}.theme p{font-size:12px;color:#c1bfb9;margin:0}.theme p span{float:right}.toolbar{display:flex;justify-content:space-between;padding:12px 14px;color:#c1bfb9;font-size:11px}.outline{padding:0 12px 22px}.row{--level:#c1bfb9;position:relative;background:#1c1f26;border:1px solid #1b2a4a;border-left:3px solid var(--level);border-radius:12px;margin-bottom:20px;animation:appear .45s ease both}.row-heading{display:flex;align-items:flex-start;gap:5px;padding:12px 8px;line-height:1.4}.row-heading>span{color:#8f9298}.row-heading .number{color:var(--level);font-weight:700}.row strong{font-size:12px;font-weight:600;flex:1}.add{position:absolute;right:10px;bottom:-11px;background:#1c1f26;border:1px solid #293248;color:#d4a94a;border-radius:50%;width:25px;height:25px;display:grid;place-items:center;font-size:20px;line-height:1;box-shadow:0 3px 10px #0004}.sub{--level:#d4a94a;margin-left:12px}.detail{--level:#10b981;margin-left:24px}.content{border-top:1px solid #293248}.format{display:flex;align-items:center;gap:16px;padding:8px 10px;background:#242832;color:#c1bfb9}.format span:last-child{color:#d4a94a}.content p{margin:10px 12px;line-height:1.7;font-size:13px}.focused{box-shadow:0 0 0 1px #d4a94a55}.selection{background:#32689d;color:#fff}.highlighted,mark{background:#f0d68a;color:#181b21;padding:1px 2px;border-radius:2px}.selected{background:#d4a94a25!important;box-shadow:0 0 0 1px #d4a94a!important}.pulse{background:#d4a94a;color:#15171c;box-shadow:0 0 0 6px #d4a94a25}.add-overlay{position:absolute;inset:0;background:#0006;display:flex;align-items:flex-end;z-index:2}.add-sheet{width:100%;padding:14px;background:#1c1f26;border:1px solid #293248;border-radius:16px 16px 0 0;animation:appear .4s ease both}.handle{width:35px;height:4px;background:#293248;border-radius:4px;margin:0 auto 12px}.add-sheet h2{font-size:12px;padding-bottom:10px;border-bottom:1px solid #293248;margin:0 0 10px}.option{display:flex;align-items:center;gap:9px;border:1px solid #293248;border-left:3px solid #c1bfb9;border-radius:10px;padding:9px;margin-bottom:8px}.option>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ffffff08;color:#c1bfb9;font-size:18px}.option b{display:block;font-size:12px}.option small{display:block;color:#8f9298;font-size:10px}.sub-option{margin-left:10px;border-left-color:#d4a94a}.detail-option{margin-left:20px;border-left-color:#10b981}.add-sheet>p{text-align:center;color:#c1bfb9;margin:12px 0 0;font-size:11px}.reading{position:absolute;inset:0;background:#15171c;display:flex;flex-direction:column;z-index:3}.reading header b{font-size:11px;flex:1}.reading header>span:first-child{font-size:23px}.reading-theme{padding:14px 16px;margin:0;border-bottom:1px solid #293248;font-size:14px;font-weight:600}.reading-theme small{font-weight:400;color:#c1bfb9;font-size:11px}.reading-content{flex:1;overflow:auto;padding:28px 20px}.reading h2{font-size:23px;line-height:1.4;margin:10px 0 22px}.reading-content p{font-size:17px;line-height:1.8;margin:0 0 18px}.reading footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #293248;padding:12px 18px;font-size:12px}.reading footer>span:first-child,.reading footer>span:nth-child(3){font-size:22px;border-radius:6px;min-width:30px;text-align:center}.demo-caption{flex-shrink:0;background:#101217;border-top:1px solid #293248;padding:10px 12px}.demo-caption>p{margin:0 0 8px;color:#d4a94a;font-weight:600;font-size:12px;min-height:18px}.progress{display:flex;gap:5px}.progress span{height:2px;flex:1;background:#293248}.progress .active{background:#d4a94a}.controlbar{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-top:9px}.controlbar small{font-size:8px;color:#8f9298}button{font:10px system-ui;color:#edebe6;background:#242832;border:1px solid #414650;border-radius:6px;min-height:32px;padding:6px 8px;cursor:pointer}button:focus-visible{outline:2px solid #d4a94a;outline-offset:2px}.step-controls{display:flex;gap:5px;margin-top:7px}.step-controls button{flex:1;background:transparent;color:#c1bfb9}.step-controls button[aria-pressed=true]{color:#d4a94a;border-color:#d4a94a}@keyframes appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:280px){.appbar{gap:6px}.appbar b{font-size:11px}.theme h1{font-size:17px}.row-heading{padding:10px 6px;gap:4px}.row strong{font-size:11px}.reading h2{font-size:21px}.reading-content p{font-size:16px}}
/* Cada modo substitui a tela anterior, sem sobrepor uma área rolável. */
.screen{overflow:hidden}.editing-screen{position:absolute;inset:0;overflow:auto;scrollbar-width:none}.reading,.vertical-reading{position:absolute;inset:0;height:100%;min-height:0;overflow:hidden}.reading-content{min-height:0}.reading header,.vertical-reading header{flex-shrink:0;justify-content:space-between;gap:6px}.reading header b,.vertical-reading header b{flex:0 1 auto;color:#d4a94a;font-size:10px}.reading header>span,.vertical-reading header>span{font-size:11px}.reading header>span:first-child,.vertical-reading header>span:first-child{font-size:23px}.reading-theme{flex-shrink:0;border-left:2px solid #d4a94a;margin:16px 14px 0;padding:0 0 10px 10px}.reading-content{display:flex;flex-direction:column;justify-content:center;padding-top:20px;padding-bottom:20px}.vertical-reading{display:flex;flex-direction:column;background:#15171c}.vertical-reading header{display:flex;align-items:center;min-height:47px;padding:0 10px;border-bottom:1px solid #293248;background:#1c1f26}.vertical-scroll{flex:1;min-height:0;overflow:auto;padding-bottom:18px;scrollbar-width:none}.vertical-topic{padding:14px 12px 0}.vertical-topic h2{font-size:17px;line-height:1.5;margin:6px 0 10px}.vertical-topic h3{font-size:15px;line-height:1.5;margin:12px 0 8px}.vertical-topic p{font-size:14px;line-height:1.8;color:#c1bfb9;margin:8px 0 14px;padding-left:10px}.vertical-topic h2>span{color:#edebe6;font-size:12px}.vertical-topic h3>span{color:#d4a94a;font-size:12px}.vertical-topic small{color:#8dafe9;font-size:10px}.vertical-sub{padding-left:18px}.vertical-detail{padding-left:18px}.vertical-detail h3>span{color:#10b981}.step-controls{gap:4px}.step-controls button{font-size:9px;padding:6px 4px}