/* MyRPGWorld v0.2 — A medieval campaign archive, not a dashboard skin. All frames, buttons, layout and overlays below are real CSS. No mockup is a background. */ :root{ --ink:#34261b;--ink-soft:#6a5239;--paper:#e8d4a7;--paper-light:#f4e4bd;--paper-dark:#c8aa77; --coal:#171615;--wood:#241b17;--bronze:#a77b41;--gold:#d9b36c;--gold-light:#f0d59a; --red:#68251e;--red-light:#9b3b30;--blue:#264e6b;--line:#ad8956; --display:'Cinzel','Palatino Linotype',Georgia,serif; --book:'IM Fell English','Palatino Linotype',Georgia,serif; --sidebar:224px;--topbar:88px; } *{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#9a7546 transparent} *::-webkit-scrollbar{width:8px;height:8px} *::-webkit-scrollbar-track{background:transparent} *::-webkit-scrollbar-thumb{background:#9a7546;border-radius:8px} *::-webkit-scrollbar-thumb:hover{background:#78552f} html{scroll-behavior:smooth} body{margin:0;background:#171614;color:var(--ink);font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.45} button,input,select,textarea{font:inherit} button{cursor:pointer} img{max-width:100%} a{text-decoration:none;color:inherit} [hidden]{display:none!important} :focus-visible{outline:2px solid #d39747;outline-offset:3px} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .app-shell{min-height:100vh;background:radial-gradient(ellipse at 40% -10%,#5a4630 0,transparent 50%),repeating-linear-gradient(0deg,#292521 0 4px,#25211d 5px 8px)} /* LEFT RAIL — leather, individual tabs, a small insignia; not an image of a room. */ .sidebar{position:fixed;z-index:30;inset:0 auto 0 0;width:var(--sidebar);display:flex;flex-direction:column;color:#e7d3ab;background:linear-gradient(105deg,rgba(255,255,255,.035),transparent 31%),repeating-linear-gradient(92deg,#1a1917 0 5px,#1d1b18 6px 9px);border-right:3px ridge #87683e;box-shadow:3px 0 18px #060606ad;overflow-y:auto} .brand{min-height:104px;display:flex;align-items:center;gap:9px;padding:16px 12px 11px;border-bottom:1px solid #8a6839;background:linear-gradient(180deg,#2d251c,#171614);color:var(--gold-light);position:relative} .brand:after{content:'';position:absolute;bottom:5px;right:16px;left:16px;height:1px;background:linear-gradient(90deg,transparent,#9b773f,transparent)} .brand-mark{font-size:49px;line-height:1;color:var(--gold);font-family:Georgia;text-shadow:0 1px 2px #050505} .brand-name{display:block;font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-1px;text-shadow:0 2px #000;white-space:nowrap} .brand-name small{display:block;font-family:Georgia,serif;letter-spacing:1.15px;font-weight:normal;font-size:8px;color:#d3b987;text-align:center;margin-top:2px} .sidebar-caption{padding:17px 13px 7px;font:9px var(--display);letter-spacing:2px;color:#ac8d62;text-align:center} .main-nav{padding:3px 8px;display:grid;gap:4px} .nav-link{width:100%;border:1px solid transparent;border-bottom-color:#6e55345e;background:linear-gradient(90deg,#221b18,#1d1b18);color:#ecdfc8;min-height:55px;display:flex;align-items:center;text-align:left;gap:11px;padding:7px 10px;font-family:var(--book);font-size:17px;transition:background .15s,color .15s} .nav-link:hover{background:#33231d;color:#ffdfa2} .nav-link.active{border-color:#bb904e;box-shadow:inset 0 0 0 2px #54261e,0 0 7px #000b;background:linear-gradient(90deg,#6b2922,#421e1a);color:#fff0c9} .nav-icon{width:52px;height:52px;flex:0 0 52px;display:grid;place-items:center}.nav-icon img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 2px 2px #0009);transition:transform .15s}.nav-link:hover .nav-icon img{transform:scale(1.06)} .nav-link > .nav-copy{flex:1;min-width:0}.nav-link small{font:11px Georgia;color:#baa994;display:block;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-link.active small{color:#dcc4a2} .sidebar-insignia{margin:26px auto 18px;width:calc(100% - 35px);min-height:166px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-top:1px solid #6b5032;border-bottom:1px solid #6b5032;color:#b79255;background:radial-gradient(ellipse at center,#62412352,transparent 67%)} .sidebar-insignia span{font-size:32px}.sidebar-insignia strong{font:italic 13px/1.7 var(--book);letter-spacing:1.3px;text-transform:uppercase} .sidebar-bottom{margin-top:auto;padding:14px 10px 16px;border-top:1px solid #775932;background:#161512}.gm-switch-line{display:flex;align-items:center;justify-content:space-between;font:13px Georgia;color:#e6d1aa;cursor:pointer;gap:7px} .gm-switch-line small{display:block;color:#ac9777;font-size:10px}.gm-switch-line input{position:absolute;opacity:0;width:1px;height:1px}.toggle-rail{width:37px;min-width:37px;height:21px;border-radius:22px;background:#55483a;border:1px solid #96794b;position:relative}.toggle-rail:after{content:'';position:absolute;left:3px;top:3px;width:13px;height:13px;border-radius:50%;background:#d5c39e;transition:transform .2s}.gm-switch-line input:checked+.toggle-rail{background:#6b2d25}.gm-switch-line input:checked+.toggle-rail:after{transform:translateX(16px);background:#f6d58e}.sidebar-disclaimer{display:block;margin-top:8px;font-size:10px;color:#8d816e;line-height:1.3} /* HEADER */ .main-column{margin-left:var(--sidebar);min-width:0;min-height:100vh;display:flex;flex-direction:column} .topbar{z-index:20;position:sticky;top:0;display:flex;align-items:stretch;gap:10px;min-height:var(--topbar);padding:5px 12px;background:linear-gradient(180deg,#262421,#111212);border-bottom:3px ridge #a37d46;box-shadow:0 4px 12px #0908067a;color:#efdfbf} .top-nav{display:flex;align-items:stretch;gap:2px;flex:1;min-width:0}.top-link{background:transparent;color:#d4c3a3;border:1px solid transparent;border-bottom:2px solid transparent;min-width:0;padding:6px 9px;font:12px var(--display);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;transition:background .15s} .top-link span{font-size:22px;line-height:1;color:#b79560;font-family:Georgia}.top-link:hover{background:#3a2b1f;color:#ffe5a9}.top-link.active{color:#f6dda2;border:1px solid #ac8042;border-bottom:2px solid #e0bd7d;background:linear-gradient(#613524,#392018);box-shadow:inset 0 1px #c8a05a52} .global-search{align-self:center;display:flex;align-items:center;gap:7px;width:clamp(150px,21vw,300px);height:35px;padding:0 9px;background:#11171a;border:1px solid #6d614c;border-radius:3px;color:#c2ad89}.global-search span{font-size:22px}.global-search input{background:none;border:0;color:#e8d6b7;outline:0;width:100%;font:12px Georgia;min-width:0}.global-search input::placeholder{color:#8f8b83}.top-utility{display:flex;align-items:center;gap:4px}.theme-switch{width:28px;height:28px;margin-right:2px;padding:0;display:grid;place-items:center;border:1px solid #6d614c;border-radius:3px;background:#11171a;color:#e8d6b7;font:15px/1 Georgia}.theme-switch[aria-pressed="true"]{color:#f0d59a;border-color:#a77b41}.lang-switch{display:flex;align-items:center;margin-right:6px}.lang-switch select{height:28px;min-width:52px;padding:0 4px;border:1px solid #6d614c;border-radius:3px;background:#11171a;color:#e8d6b7;font:11px/1 var(--display);letter-spacing:.06em;cursor:pointer}.utility-btn{background:transparent;color:#d8be8e;border:0;border-left:1px solid #4c4437;padding:0 7px;font-size:20px}.utility-btn:hover{color:white}.account-badge{border:2px solid #a88755;width:37px;height:37px;display:grid;place-items:center;border-radius:50%;color:#e3c993;background:linear-gradient(#413127,#171819);font-size:21px;margin-left:4px}.mobile-menu,.mobile-current{display:none} #main-content{width:100%;max-width:1710px;margin:0 auto;padding:14px 15px 28px;flex:1} .view{display:none;animation:fadein .15s ease-out}.view.active{display:block}@keyframes fadein{from{opacity:.5}to{opacity:1}} .site-footer{margin-top:auto;padding:12px 17px;color:#af9167;display:flex;justify-content:space-between;gap:15px;font:10px var(--display);letter-spacing:.5px;border-top:1px solid #8e6c45;background:#151411} /* v0.2.1 — navegação enxuta. A sidebar desktop cabe sem rolagem desnecessária. */ .sidebar{overflow-y:hidden} .sidebar-caption{padding:11px 13px 5px} .main-nav{gap:3px;min-height:0} .nav-link{min-height:clamp(34px,calc((100dvh - 244px)/9),55px)} .sidebar-bottom{flex-shrink:0;padding:11px 10px 12px} .topbar{align-items:center;--topbar:88px;gap:12px;min-height:88px;padding:4px 12px} .top-mini{display:flex;align-items:center;flex:1;min-width:0;gap:8px;color:#ead8b8} .mini-cover{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;padding:0;border:0;background:transparent}.mini-cover img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 2px 2px #0009);transition:transform .15s} .mini-buttons button:not(:disabled):hover{background:#483226;color:#ffe7aa}.mini-cover:hover img{transform:scale(1.06)} #mini-title{flex:1 1 80px;min-width:0;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:14px var(--book);color:#f2e2c1} .mini-buttons{flex:0 0 auto;display:flex;align-items:center;gap:3px;border-left:1px solid #4f4132;padding-left:9px} .mini-buttons button{width:30px;height:32px;background:transparent;border:1px solid transparent;color:#d1b988;font:17px Georgia;display:grid;place-items:center;padding:0} .mini-buttons button:disabled{opacity:.35;cursor:not-allowed} .mini-buttons .mini-play{border:1px solid #98713e;background:#49261f;color:#f5d596;width:33px;height:33px} .mini-buttons button[aria-pressed="true"]{color:#fae4ac;background:#5a3522;border-color:#c49b5b} .mini-spotify-wrap{flex:1 1 320px;display:flex;align-items:center;gap:8px;min-width:220px;max-width:460px} .mini-spotify-slot{flex:1;min-width:0;height:80px;display:flex;align-items:center;overflow:hidden;font:13px/1.4 Georgia;color:#c4ad84} .mini-spotify-slot p{margin:0;padding:0 12px} .mini-spotify-slot iframe{width:100%;height:80px;display:block;border:0;border-radius:8px;background:#171714} .player-switch{display:flex;flex:0 0 auto;border:1px solid #6d5438;border-radius:2px;overflow:hidden} .player-switch button{height:28px;padding:0 10px;border:0;background:#1a1612;color:#a89474;font:11px var(--display);letter-spacing:.3px} .player-switch button[data-player-mode="spotify"][aria-pressed="true"]{background:#6d2e26;color:#fae4ac} .player-switch button[data-player-mode="local"][aria-pressed="true"]{background:#3a2e24;color:#e6d3ae} .player-local{display:flex;align-items:center;gap:8px;min-width:0;flex:1} .player-local #mini-title{color:#b7a48a;font-size:13px} .top-mini[data-player="spotify"] .player-local,.top-mini[data-player="local"] .player-spotify{display:none} /* Alturas muito pequenas: priorizar acesso ao modo mestre em vez de ocultar itens. */ @media(max-height:630px){.sidebar{overflow-y:auto}.brand{min-height:72px;padding:8px 12px}.brand-mark{font-size:35px}.sidebar-caption{padding:5px}.main-nav{gap:1px}.nav-link{min-height:39px;padding:4px 8px}.nav-icon{font-size:23px}.sidebar-bottom{padding:7px 10px}} @media(max-width:1290px){.top-mini{gap:6px}#mini-title{max-width:160px}.topbar{gap:8px}.mini-buttons{gap:1px;padding-left:5px}} @media(max-width:1030px){.sidebar{overflow-y:auto}} @media(max-width:860px){#mini-title{font-size:12px}.mini-cover{width:31px;flex-basis:31px;height:34px}.mini-buttons button{width:27px}.topbar .global-search{width:155px}} @media(max-width:680px){.topbar{flex-wrap:wrap;padding:6px 9px;row-gap:7px}.top-mini{flex:1;order:1}.mobile-menu{order:0;flex-shrink:0}.top-utility{order:2}.topbar .global-search{order:3;flex:1 0 100%;width:100%;height:30px}.account-badge{display:none}#mini-title{max-width:140px}.mini-buttons button{width:25px;height:29px}.mini-buttons .mini-play{width:29px;height:29px}.mini-spotify-wrap{flex-basis:100%;max-width:none}} @media(max-width:430px){.mini-cover,.mini-track{display:none}.mini-buttons{border-left:0;padding-left:0}.top-mini{justify-content:space-between}.top-utility .utility-btn{font-size:17px;padding:0 4px}} /* PAPER: 1px double outlines and convincing color, but no fake 3D render baked in. */ .parchment-corner,.panel-paper,.paper-section,.chapter-header,.open-book{position:relative;color:var(--ink);background-color:var(--paper);background-image:radial-gradient(ellipse at 22% 4%,#fff4d17e,transparent 48%),radial-gradient(ellipse at 92% 86%,#90673c25,transparent 45%),repeating-linear-gradient(90deg,transparent 0 29px,#734e1708 30px 32px),linear-gradient(125deg,#cfb07b,#efdbb3 18%,#e6cca0 65%,#d0aa72);border:1px solid #a2804f;outline:2px solid #3c281d;outline-offset:-4px;box-shadow:inset 0 0 0 4px #f0dfb7a8,inset 0 0 20px #916b3b54,0 3px 4px #0008} .parchment-corner:before,.panel-paper:before,.paper-section:before{pointer-events:none;content:'◇';font-size:17px;color:#876137;position:absolute;top:1px;left:5px;line-height:1} .parchment-corner:after,.panel-paper:after,.paper-section:after{pointer-events:none;content:'◇';font-size:17px;color:#876137;position:absolute;right:5px;bottom:0;line-height:1} .panel{min-width:0;overflow:hidden}.panel-paper{padding:11px 12px 13px}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:1px 0 8px;border-bottom:1px solid #b38b4e66;margin-bottom:9px}.panel-header h2{margin:0;font:21px var(--book);color:#312114;line-height:1.1}.minor-link{border:0;background:none;color:#663b26;font:12px var(--book);white-space:nowrap;text-decoration:none;padding:3px}.minor-link:hover{text-decoration:underline;color:#9a332b}.minor-link.light{color:#e9ca8e}.label-caps{font:10px var(--display);letter-spacing:1.4px;color:#7e5733}.red-button,.outline-button,.file-chooser{min-height:31px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:6px 13px;border:1px solid #c39054;outline:1px solid #3c2119;outline-offset:-4px;background:linear-gradient(#8e3d32,#5c231b);box-shadow:inset 0 1px #e8a76e61,0 2px 3px #0005;color:#ffebc3;font:12px var(--display);text-shadow:0 1px #23140d;letter-spacing:.15px;text-align:center;text-decoration:none;transition:filter .15s,transform .15s}.red-button:hover,.file-chooser:hover{filter:brightness(1.22)}.red-button:active,.outline-button:active{transform:translateY(1px)}.red-button.full{width:100%}.outline-button{background:linear-gradient(#f5e4bc,#c8a66e);color:#593821;text-shadow:none;border-color:#775431}.outline-button:hover{filter:brightness(1.06)}.gm-only{display:none!important}.gm-active .gm-only{display:block!important}.gm-active .red-button.gm-only,.gm-active .outline-button.gm-only{display:inline-flex!important} /* Barra de vitalidade original da v0.2: usada também na ficha de Personagens. */ .mini-meter{height:14px;margin:4px 4px 0;display:block;border:1px solid #8d714a;position:relative;border-radius:3px;overflow:hidden;background:#241b1b;box-shadow:inset 0 2px 3px #000b} .mini-meter>span{display:block;height:100%} .mini-meter.red>span{background:linear-gradient(#e85a4b,#8e1920)} .mini-meter.blue>span{background:linear-gradient(#5cbbe3,#14547e)} .mini-meter b{font:11px Georgia;color:#fff7e2;position:absolute;inset:0;display:grid;place-items:center;text-shadow:0 1px #000,1px 0 #000,-1px 0 #000} /* CHAPTER LAYOUT */ .chapter-header{padding:21px 24px;margin-bottom:12px;min-height:119px;overflow:hidden}.chapter-header h1{font:39px/1.07 var(--book);margin:6px 0 5px}.chapter-header p{font:17px var(--book);margin:0;max-width:620px}.chapter-header-image{background-image:linear-gradient(90deg,#edd7a7 0%,#edd7a7 42%,transparent 82%);background-size:cover;background-position:center right}.chapter-actions{display:flex;justify-content:space-between;align-items:center;gap:15px;color:#d1b58e;margin:12px 2px;font:13px var(--book)}.paper-section{min-width:0}.content-pad{padding:17px}.ink-heading{font:24px var(--book);margin:0 0 11px}.folio-count{font:11px var(--display);letter-spacing:.5px;color:#855835} /* Character sheet */ .character-layout{display:grid;grid-template-columns:minmax(220px,285px) minmax(0,1fr);gap:14px}.character-layout>.paper-section{padding:17px}.character-rail{display:grid;gap:9px}.character-option{width:100%;display:flex;align-items:center;gap:11px;border:1px solid #a3885e;text-align:left;padding:6px;background:#f6e5be;color:#38281a}.character-option:hover{background:#fff2d5}.character-option.active{box-shadow:inset 0 0 0 2px #9c7543;background:#e7c995}.option-face{flex:0 0 60px;width:60px;height:67px;object-fit:cover;object-position:top;border:2px ridge #88683e}.character-option strong{display:block;font:19px var(--book)}.character-option small{display:block;color:#71513a;font:13px var(--book)}.character-option i{font:10px var(--display);color:#81542d}.sheet-top{display:flex;gap:20px;align-items:flex-start;padding-bottom:17px;border-bottom:2px solid #ab8b56}.sheet-face{flex:0 0 170px}.sheet-art{width:170px;height:192px;display:block;object-fit:cover;object-position:top center;border:4px ridge #987749;box-shadow:0 2px 5px #0006}.sheet-intro{min-width:0;flex:1}.sheet-intro h2{font:38px var(--book);margin:5px 0 7px}.sheet-intro p{margin:0 0 13px;font:17px/1.4 var(--book)}.sheet-intro-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.pdf-empty{font:12px var(--book);padding:8px;border:1px dashed #957344}.sheet-intro #roll-result{display:block;margin-top:8px;color:#7f2b22;font:bold 15px Georgia;min-height:21px}.section-line{margin:22px 0 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #9c78496b}.section-line h3{font:23px var(--book);margin:0 0 4px}.section-line small{font:10px var(--display);color:#8c6240}.vital-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.vital-box{padding:12px;border:1px solid #b18f5c;background:#ead3a3a8}.vital-box>span{display:block;font:14px var(--display);font-weight:600}.vital-box>strong{font:25px var(--book);display:block;margin:4px 0}.vital-box .mini-meter{margin:6px 0;height:16px}.hp-actions{display:flex;gap:5px;margin-top:10px}.hp-actions button{flex:1;border:1px solid #816141;background:linear-gradient(#f7e4b7,#cfb184);color:#4b3326;padding:3px}.hp-actions button:hover{background:#fff1c8}.vital-fine{font:12px var(--display);color:#765235;margin-top:12px}.ability-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.ability{display:grid;justify-items:center;gap:4px;padding:8px 3px;border:1px solid #aa8756;background:#f3e0b7;font:12px var(--display)}.ability input{width:56px;padding:4px;text-align:center;background:#fff3d8;border:1px solid #b69b70;font:22px var(--book);color:#4b2b1d}.ability button{width:58px;padding:3px;background:#482820;color:#efddb7;border:1px solid #a58556;font:12px Georgia}.form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.data-field{display:grid;gap:5px;font:bold 12px var(--book);color:#60422f}.data-field input,.data-field textarea,.toolbar input,.toolbar select,.spotify-form input{min-width:0;width:100%;padding:7px 8px;border:1px solid #9b7c52;border-radius:0;background:#fff1cd;color:#3b281d;font:14px Georgia}.data-field textarea{resize:vertical}.notes-grid{grid-template-columns:1fr 1fr;margin-top:10px}.sheet-last{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:13px;font:14px var(--book)}.fineprint{font:11px/1.4 Georgia;color:#715c47;margin:13px 0 0} /* NPC ledger */ .toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:5px 0 17px}.filter-search{display:flex;align-items:center;gap:4px;background:#f9edcc;border:1px solid #aa8959;color:#7d5b3a;flex:1;min-width:210px;font:23px Georgia;padding:0 8px}.filter-search input{border:0;background:none;outline:0}.toolbar select{max-width:230px}.npc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.npc-card{background:#f2dfb7;border:1px solid #a17e4e;padding:6px;min-width:0;display:flex;text-align:left;gap:11px;color:#302218;box-shadow:inset 0 0 0 3px #d9be8c}.npc-card:hover{background:#fff0ca;transform:translateY(-1px)}.npc-image{flex:0 0 102px}.npc-portrait{width:102px;height:130px;object-fit:cover;object-position:center top;display:block;border:2px ridge #856237}.npc-summary{padding:5px 1px;min-width:0}.npc-summary h3{margin:6px 0 1px;font:22px/1.08 var(--book)}.npc-summary p{margin:3px 0 15px;color:#725137;font:14px var(--book)}.npc-summary small{font:12px var(--book)}.relation{display:inline-block;border:1px solid #8e754a;background:#ddd1aa;padding:2px 5px;font:10px var(--display)}.relation.Aliado{color:#31572e}.relation.Hostil{color:#8f2520}.relation.Neutro{color:#756047} /* ATLAS: image is just an img element and dots are HTML nodes positioned with %. */ .atlas-tabs{display:flex;gap:8px;margin:12px 0}.atlas-tabs button{background:#2b2119;border:1px solid #9a794d;color:#ebd2aa;padding:8px 16px;font:12px var(--display)}.atlas-tabs button.active{background:linear-gradient(#834033,#57231f);box-shadow:inset 0 0 0 2px #b78b50;color:#fff2cc}.atlas-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:13px;align-items:start}.atlas-board,.atlas-side{padding:13px}.atlas-board-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.atlas-board-top .ink-heading{margin:0 0 11px}.atlas-controls{display:flex;align-items:center;gap:3px;color:#694323}.atlas-controls button{background:#f7e6bc;border:1px solid #846440;width:30px;height:28px;color:#513923;font-size:19px}.atlas-controls output{min-width:42px;text-align:center;font:12px var(--display)}.map-viewport{width:100%;overflow:auto;border:4px ridge #755d40;background:#214a56;scrollbar-color:#94764a #262523;max-height:min(68vh,685px)}.map-stage{width:100%;position:relative;aspect-ratio:5/3;min-width:100%;line-height:0;transform-origin:top left}.map-stage>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}.map-markers{position:absolute;inset:0;pointer-events:none}.map-marker{pointer-events:auto;position:absolute;width:29px;height:33px;transform:translate(-50%,-90%);clip-path:polygon(50% 100%,0 36%,0 13%,16% 0,84% 0,100% 13%,100% 36%);background:#6d2620;border:0;color:#ffe5a7;filter:drop-shadow(0 2px 3px #0008);font-size:18px;display:grid;place-items:center}.map-marker span{transform:translateY(-4px);line-height:1}.map-marker:hover,.map-marker.selected{background:#c5953f;color:#26180e;scale:1.15;z-index:4}.map-help{font:12px var(--book);color:#755b44;margin:10px 0 2px}.location-item{display:flex;gap:9px;align-items:center;text-align:left;width:100%;padding:9px 6px;background:transparent;border:0;border-bottom:1px solid #a480545e;color:#442c1b}.location-item>span:first-child{font-size:23px;color:#8b4a2c}.location-item>span:nth-child(2){flex:1}.location-item strong{display:block;font:17px var(--book)}.location-item small{display:block;font:11px Georgia;color:#765d42}.location-item i{font-size:22px;font-style:normal}.location-item:hover,.location-item.active{background:#fff0c49e}.location-item.active strong{color:#872d25}.location-detail{border-top:2px solid #a18250;margin-top:15px;padding:14px 2px 2px}.location-detail h3{font:27px var(--book);margin:6px 0 0}.location-detail em{font:14px var(--book);color:#895c39}.location-detail p{font:16px/1.42 var(--book)} /* CHRONICLES: two truly independent HTML pages; a central paper crease. */ .open-book{display:grid;grid-template-columns:1fr 1fr;min-height:560px;background:linear-gradient(90deg,#e4c897 0%,#f2dfb8 45%,#94764a 49.75%,#52351e 50%,#e8cea3 50.6%,#f0dab2 100%);border:5px solid #3a281c;outline:2px solid #c19b5c;box-shadow:0 4px 13px #0009}.book-page{position:relative;padding:26px;min-width:0}.left-page{border-right:1px solid #704e30}.right-page{border-left:1px solid #fcebc7}.book-title{text-align:center;padding-bottom:15px;border-bottom:1px solid #987549;margin-bottom:18px}.book-title>span{font-size:25px;color:#8b5e36}.book-title h2{font:32px var(--book);margin:0}.book-title small{font:10px var(--display);color:#805d3d;letter-spacing:1px}.chronicle-index{display:grid;gap:5px}.chronicle-row{width:100%;display:flex;gap:12px;align-items:center;text-align:left;border:1px solid transparent;border-bottom-color:#a3825369;background:transparent;color:#39281d;padding:6px}.chronicle-row:hover,.chronicle-row.active{background:#fff2ce99;border:1px solid #bb9867}.chronicle-thumb{width:91px;flex:0 0 91px;height:70px;border:2px solid #997749;object-fit:cover}.chronicle-row span{display:grid;min-width:0}.chronicle-row small{font:10px var(--display);color:#8c5b37}.chronicle-row strong{font:19px var(--book);margin:1px 0}.chronicle-row em{font:12px/1.2 var(--book);color:#6d513d;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-style:normal}.chronicle-illustration{width:100%;height:230px;object-fit:cover;border:3px double #937048;display:block;margin-bottom:13px}.chronicle-detail h3{font:29px var(--book);margin:7px 0}.chronicle-detail p{font:17px/1.55 var(--book)}.tag-row{display:flex;gap:5px;flex-wrap:wrap}.tag-row span{font:11px var(--book);border:1px solid #a18151;padding:2px 8px;background:#f5e7c7}.book-aside{border-top:1px solid #a58854;padding-top:12px;margin-top:22px}.book-aside h3{font:23px var(--book);margin:4px 0}.book-aside p{font:16px var(--book)}.book-flourish{display:block;text-align:center;font-size:23px;color:#8d6740} /* BESTIARY: colored painting and book-style stat block on the right. */ .bestiary-layout{display:grid;grid-template-columns:minmax(225px,32%) minmax(0,1fr);gap:16px}.bestiary-index{border:1px solid #b5935d;background:#e1c99e80;padding:7px;align-self:start;display:grid;gap:5px}.beast-index-item{display:flex;gap:9px;align-items:center;width:100%;background:#f6e7c4;border:1px solid #ad8d5e;color:#39271a;text-align:left;padding:5px}.beast-index-item:hover,.beast-index-item.active{background:#d7b782;border-color:#885a34}.beast-index-image{flex:0 0 65px;width:65px;height:67px;object-fit:cover;border:2px ridge #8e6f46}.beast-index-item span{min-width:0}.beast-index-item strong{display:block;font:19px/1.1 var(--book)}.beast-index-item small{font:12px var(--book);display:block;color:#78563b;margin:3px 0}.beast-index-item em{font:10px var(--display);color:#8f271d;font-style:normal}.monster-page{border:1px solid #a17b47;box-shadow:inset 0 0 0 4px #e9d1a4;background:#f2dfb7}.monster-image{width:100%;height:280px;display:block;object-fit:cover;object-position:center 32%;border-bottom:4px ridge #947043}.monster-description{padding:19px 22px 23px}.monster-description h2{margin:5px 0;font:36px var(--book);color:#6f241f}.monster-description em{font:15px var(--book);color:#815635}.monster-description p{font:15px/1.5 var(--book)}.monster-description p strong{color:#802f24}.monster-rule{height:5px;margin:15px 0 10px;border:1px solid #a7683b;background:linear-gradient(90deg,#60221f,#b18243,#60221f)}.monster-description h3{font:25px var(--book);margin:12px 0}.monster-abilities{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;text-align:center}.monster-abilities div{display:grid;padding:6px 2px;border-right:1px solid #ac8a59;color:#8d2a21}.monster-abilities div:last-child{border:0}.monster-abilities small{font:bold 11px var(--display)}.monster-abilities b{font:20px var(--book)}.monster-abilities span{font:12px Georgia}.monster-trait{border-bottom:1px solid #a88a5e66;padding-bottom:8px} .bestiary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-content:start}.beast-card{min-width:0;padding:5px;background:#f2dfb7;border:1px solid #a17e4e;box-shadow:inset 0 0 0 3px #d9be8c;color:#302218;text-align:left}.beast-card:hover,.beast-card.active{background:#fff0ca;border-color:#885a34}.beast-card-image{display:block;width:100%;height:92px;object-fit:contain;object-position:center;border:2px ridge #856237;background:transparent}.beast-card-summary{display:grid;min-width:0;padding:5px 6px 4px}.beast-card-summary em{justify-self:start;padding:1px 5px;border:1px solid #9a7544;color:#8f271d;font:10px var(--display);font-style:normal}.beast-card-summary strong{margin:3px 0 1px;font:20px/1.05 var(--book)}.beast-card-summary small{overflow:hidden;color:#725137;font:13px var(--book);text-overflow:ellipsis;white-space:nowrap}.monster-modal{overflow:hidden}.monster-modal .monster-image{width:auto;max-width:100%;height:96px;margin-inline:auto;object-fit:contain;object-position:center;background:transparent}.monster-modal .monster-description{padding:10px 16px 12px}.monster-modal .monster-description :is(h2,h3,p,em){margin:4px 0}.monster-modal .monster-description h2{font-size:30px}.monster-modal .monster-description p{line-height:1.35}.monster-modal .monster-rule{margin:8px 0}.monster-modal .monster-trait{padding-bottom:2px}.monster-modal .fineprint{margin-top:6px}.beast-detail-actions{display:flex;justify-content:flex-end;margin-top:8px} /* TAVERN: dark illustrated chapter top, real functional players in paper blocks. */ .tavern-chapter{border-color:#b48f57}.tavern-layout{display:grid;grid-template-columns:1fr 1fr;gap:13px}.tavern-layout .paper-section>p{font:16px var(--book);color:#65472f}.spotify-form{display:flex;gap:7px}.spotify-form input{flex:1}.spotify-placeholder{border:2px dashed #ba9861;margin-top:15px;min-height:230px;background:#f4e3bc8c;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.spotify-placeholder h3{font:24px var(--book);margin:6px}.spotify-placeholder p{font:13px var(--book)}.music-ornament{font-size:43px;color:#a17645}.spotify-embed{display:block;width:100%;height:352px;border:0;margin-top:16px;border-radius:9px}.form-feedback{color:#7b3328;font:12px Georgia;min-height:16px}.file-chooser{margin:13px 0;color:#f8e6c0;cursor:pointer}.audio-playlist{display:grid;max-height:230px;overflow:auto;margin:12px 0}.audio-track{padding:9px;background:#f8eaca;border:0;border-bottom:1px solid #a7895b;color:#4c3221;text-align:left}.audio-track span{color:#9c5b2a;margin-right:8px}.audio-track.active,.audio-track:hover{background:#dfc294}.local-audio{width:100%;height:41px}.legal-note{font:12px Georgia;color:#c6a576;margin-top:12px} /* Dialog */ .detail-dialog{position:fixed;max-width:min(680px,calc(100vw - 24px));width:100%;max-height:85vh;overflow-y:auto;border:5px ridge #916d3e;padding:27px;background:linear-gradient(135deg,#f3e2b9,#d8bc8b);color:var(--ink);box-shadow:0 20px 100px #000c}.detail-dialog::backdrop{background:#100b08c9;backdrop-filter:blur(2px)}.dialog-close{position:absolute;z-index:5;top:12px;right:12px;box-sizing:border-box;width:36px;height:36px;margin:0;padding:0;border:1px solid #e6c79a;border-radius:4px;background:#642920;box-shadow:inset 0 0 0 1px #3c1612;color:transparent;font-size:0;line-height:0}.dialog-close::before,.dialog-close::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:2px;margin:0;border-radius:1px;background:#f6dba9;pointer-events:none}.dialog-close::before{transform:translate(-50%,-50%) rotate(45deg)}.dialog-close::after{transform:translate(-50%,-50%) rotate(-45deg)}.modal-layout{display:grid;grid-template-columns:195px 1fr;gap:18px}.modal-art{width:195px;height:250px;object-fit:cover;border:3px ridge #9c7748}.modal-layout h2{font:32px var(--book);margin:7px 0}.modal-layout p{font:16px/1.4 var(--book)}.modal-layout hr{border:0;border-top:1px solid #997c4c}.gm-modal-note textarea{width:100%;margin-top:5px}.missing-image{display:grid;place-items:center;background:linear-gradient(135deg,#1d2c28,#675039);color:#b9965c;font-size:35px}.drawer-overlay{display:none}.drawer-overlay:not([hidden]){position:fixed;inset:0;background:#000b;z-index:25;display:block}#toast{position:fixed;z-index:200;bottom:20px;right:20px;max-width:400px;transform:translateY(30px);opacity:0;pointer-events:none;padding:12px 18px;background:#241a15;color:#f2dfbb;border:1px solid #ab8149;box-shadow:0 4px 18px #000a;transition:transform .2s,opacity .2s;font:13px Georgia}#toast.show{transform:translateY(0);opacity:1} @media(max-width:1510px){.top-link{padding:6px 6px;font-size:11px}.global-search{width:clamp(145px,17vw,260px)}.brand-name{font-size:20px}.hero-text h1{font-size:31px}.hall-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(215px,.59fr)}.portrait-frame{height:131px}.map-preview{height:236px}.featured-image{height:185px}.party-card>strong{font-size:14px}} @media(max-width:1290px){:root{--sidebar:207px}.top-link{font-size:10px;padding:6px 5px}.top-link span{font-size:20px}.global-search{width:155px}.hall-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'party map' 'chronicles feature' 'tavern feature'}.hall-feature{min-height:440px}.hall-feature .featured-image{height:230px}.portrait-frame{height:160px}.map-preview{height:277px}.npc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:1030px){:root{--sidebar:226px}.sidebar{transform:translateX(-102%);transition:transform .2s}.sidebar.open{transform:translateX(0)}.main-column{margin-left:0}.mobile-menu{display:block;align-self:center;border:1px solid #8f754f;background:#231a14;color:#e9d3a7;width:36px;height:36px;font-size:19px}.topbar{min-height:62px}.top-nav{justify-content:space-evenly}.global-search{width:190px}} @media(max-width:780px){#main-content{padding:11px 10px 22px}.topbar{gap:5px}.top-nav{display:none}.global-search{flex:1;width:auto}.mobile-current{display:block;font:10px var(--display);letter-spacing:1.2px;padding:7px 14px;color:#d9bd87;background:#1b1917;border-bottom:1px solid #775c3b}.mobile-current span{margin:0 5px;color:#836a43}.hall-hero{grid-template-columns:1fr;grid-template-rows:auto 120px auto}.hero-text{grid-row:1;grid-column:1;padding:22px}.hero-visual{grid-row:2;grid-column:1;margin:0;mask-image:linear-gradient(to bottom,transparent,#000 30%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 30%)}.hero-stats{grid-row:3;grid-column:1;padding:11px}.hall-grid{grid-template-columns:1fr;grid-template-areas:'party' 'map' 'chronicles' 'feature' 'tavern'}.portrait-frame{height:170px}.map-preview{height:auto;aspect-ratio:1.65}.hall-feature{min-height:0}.hall-feature .featured-image{height:250px}.character-layout,.atlas-layout,.tavern-layout,.bestiary-layout{grid-template-columns:1fr}.character-rail{display:flex;overflow-x:auto}.character-option{min-width:195px}.chapter-header{padding:20px}.chapter-header h1{font-size:34px}.npc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.open-book{grid-template-columns:1fr;background:#ead3a6}.book-page{padding:18px}.left-page{border-right:0;border-bottom:5px double #937249}.right-page{border-left:0}.map-viewport{max-height:68vh}.site-footer span:nth-child(2){display:none}} @media(max-width:510px){.brand-name{font-size:18px}.hero-text h1{font-size:30px}.hero-text p{font-size:15px}.hero-stat>span{font-size:15px}.hero-stat>b{font-size:14px}.hero-stat>small{font-size:9px}.party-tiles{gap:5px}.party-card{padding:3px}.portrait-frame{height:112px}.party-card>strong{font:13px var(--book)}.party-card>small{font-size:10px}.map-preview{aspect-ratio:1.4}.npc-grid{grid-template-columns:1fr}.sheet-top{flex-direction:column}.sheet-face{flex-basis:auto}.sheet-art{width:210px;height:200px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.notes-grid{grid-template-columns:1fr}.ability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.vital-grid{grid-template-columns:1fr}.modal-layout{grid-template-columns:1fr}.modal-art{height:220px;width:100%}.spotify-form{flex-direction:column}.monster-abilities{grid-template-columns:repeat(3,minmax(0,1fr))}.chronicle-thumb{flex-basis:65px;width:65px;height:67px}.chapter-header h1{font-size:30px}.hall-tavern-art>div{width:57%}.hall-tavern-art strong{font-size:20px}} @media(max-width:780px){.bestiary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.monster-modal .monster-image{height:220px}} @media(max-width:510px){.bestiary-grid{grid-template-columns:1fr}.beast-card-image{height:150px}.monster-modal .monster-image{height:190px}} @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}} .assets-editor{border:1px dashed #9e7442;padding:12px;margin-top:15px;background:#f7e8c78a}.assets-editor h3{font:18px var(--book);margin:0 0 9px}.assets-editor .notes-grid{margin:0} /* v0.2.3 — APENAS SALÃO. Layout editorial de quatro conteúdos, sem cartões duplicados. */ #view-inicio .hall-hero { height:clamp(132px,17vh,157px);aspect-ratio:auto;min-height:0; display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,46%); grid-template-rows:1fr;overflow:hidden;margin-bottom:12px; } #view-inicio .hero-text {grid-column:1;grid-row:1;position:relative;z-index:2;max-width:none;padding:16px 15px 12px 22px;min-width:0} #view-inicio .hero-text h1 {font:clamp(26px,2.3vw,33px)/1.06 var(--book);margin:5px 0 8px} #view-inicio .hero-text h1 span {font-style:italic} #view-inicio .hero-text p {font:15px/1.2 var(--book);margin:0;max-width:440px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden} #view-inicio .hero-visual { grid-column:2;grid-row:1;position:relative;height:100%;width:100%;aspect-ratio:auto;margin:0; background:url('../assets/images/banner_salao.webp') right center/cover no-repeat; -webkit-mask-image:linear-gradient(90deg,transparent,#000 16%); mask-image:linear-gradient(90deg,transparent,#000 16%); } #view-inicio .panel-paper {padding:13px 14px 14px} #view-inicio .panel-header {padding:0 0 7px;margin-bottom:11px} #view-inicio .panel-header h2 {font:21px/1.12 var(--book)} #view-inicio .minor-link {font:12px var(--book)} #view-inicio .hall-focus-row { display:grid;grid-template-columns:minmax(0,1.38fr) minmax(290px,.78fr); gap:12px;margin-bottom:12px;align-items:stretch; } #view-inicio .hall-recap,#view-inicio .hall-objective {min-height:clamp(174px,21vh,200px)} #view-inicio .hall-last-session { width:100%;display:flex;align-items:stretch;gap:16px;text-align:left; height:clamp(116px,15.5vh,148px);padding:0;border:0;background:transparent;color:var(--ink); } #view-inicio .hall-last-session:hover .hall-recap-text strong {color:#8c3024;text-decoration:underline} #view-inicio .hall-recap-art {width:clamp(160px,22%,210px);height:100%;flex:0 0 clamp(160px,22%,210px);display:block;object-fit:contain;object-position:center;background:#2a231d;border:2px ridge #9b7b4d} #view-inicio .hall-recap-text {display:flex;flex-direction:column;min-width:0;flex:1;gap:5px;padding-top:2px} #view-inicio .hall-recap-text small {font:10px var(--display);letter-spacing:.3px;color:#805938} #view-inicio .hall-recap-text strong {font:25px/1.08 var(--book)} #view-inicio .hall-recap-text>span {font:16px/1.32 var(--book);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden} #view-inicio .hall-objective {display:flex;flex-direction:column} #view-inicio .hall-objective>p {font:clamp(19px,1.7vw,23px)/1.25 var(--book);margin:6px 3px 12px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden} #view-inicio .hall-objective-link {align-self:flex-start;margin-top:auto} #view-inicio .hall-context-grid {display:grid;grid-template-columns:minmax(0,1.62fr) minmax(265px,.70fr);gap:12px;align-items:stretch} #view-inicio .hall-map,#view-inicio .hall-feature {min-width:0;min-height:0} #view-inicio .map-preview {display:block;position:relative;width:100%;height:clamp(215px,28vh,285px);padding:0;border:2px ridge #93754c;background:#173b45;overflow:hidden} #view-inicio .map-preview img {display:block;width:100%;height:100%;object-fit:contain;object-position:center} #view-inicio .map-preview:hover img {filter:brightness(1.08)} #view-inicio .hall-feature {display:flex;flex-direction:column} #view-inicio .hall-threat-button {display:flex;flex:1;min-width:0;flex-direction:column;align-items:stretch;gap:9px;padding:0;border:0;background:transparent;text-align:left;color:var(--ink)} #view-inicio .hall-threat-button:hover .threat-name {color:#8c3024;text-decoration:underline} #view-inicio .featured-image {display:block;flex:none;width:100%;height:clamp(120px,17vh,160px);object-fit:contain;object-position:center;border:2px ridge #9b7b4d;background:#74432e} #view-inicio .hall-threat-info {display:grid;gap:3px;padding:0 2px;min-width:0} #view-inicio .threat-name {font:23px/1.08 var(--book)} #view-inicio .threat-excerpt {font:14px/1.25 var(--book);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden} #view-inicio .hall-empty {font:16px var(--book);margin:18px 0} #view-inicio .hall-notes {margin-top:12px;padding:12px 14px} #view-inicio .hall-notes h2 {margin:0;font:19px var(--book)} #view-inicio .hall-notes p {font-size:12px;margin:3px 0 8px} #view-inicio .hall-notes textarea {width:100%;background:#faedcf;border:1px solid #927142;padding:8px;color:var(--ink)} @media (min-width:781px) and (min-height:700px) { body:has(#view-inicio.active) {overflow:hidden} .main-column:has(#view-inicio.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-inicio.active) {display:flex;flex-direction:column;min-height:0;overflow:hidden;height:100%;padding-bottom:12px} #view-inicio.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-inicio .hall-hero,#view-inicio .hall-focus-row {flex:0 0 auto} #view-inicio .hall-context-grid {flex:1 1 auto;min-height:0} #view-inicio .hall-map,#view-inicio .hall-feature {display:flex;flex-direction:column;min-height:0;overflow:hidden} #view-inicio .map-preview {flex:1 1 auto;height:auto;min-height:96px} #view-inicio .featured-image {flex:1 1 auto;height:auto;min-height:72px;max-height:160px} body.gm-active #view-inicio .hall-notes {flex:0 0 auto;margin-top:8px;padding:8px 12px 10px} body.gm-active #view-inicio .hall-notes textarea {height:48px;min-height:0;resize:none} body.gm-active #view-inicio .featured-image {max-height:140px} } @media(max-width:1090px) and (min-width:781px) { #view-inicio .hall-focus-row {grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr)} #view-inicio .hall-context-grid {grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr)} #view-inicio .hall-recap-art {flex-basis:120px;width:120px} #view-inicio .hall-recap-text>span {font-size:14px} #view-inicio .hall-objective>p {font-size:19px} } @media(max-width:780px) { #view-inicio .hall-hero {height:clamp(132px,17vh,157px);aspect-ratio:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(42%,52%);grid-template-rows:1fr} #view-inicio .hero-text {grid-column:1;grid-row:1;padding:14px 12px 10px 16px} #view-inicio .hero-visual {grid-column:2;grid-row:1;width:100%;height:100%;aspect-ratio:auto;margin:0} #view-inicio .hall-focus-row {grid-template-columns:1fr} #view-inicio .hall-recap,#view-inicio .hall-objective {min-height:0} #view-inicio .hall-last-session {height:140px} #view-inicio .hall-context-grid {grid-template-columns:1fr 1fr} #view-inicio .map-preview {height:auto;aspect-ratio:1.68} } @media(max-width:530px) { #view-inicio .hall-context-grid {grid-template-columns:1fr} #view-inicio .hall-recap-art {width:105px;flex-basis:105px} #view-inicio .hall-recap-text strong {font-size:21px} #view-inicio .hall-recap-text>span {font-size:14px;-webkit-line-clamp:3} #view-inicio .map-preview {aspect-ratio:1.68} #view-inicio .featured-image {height:145px} } @media(max-height:820px) and (min-width:781px) { #view-inicio .panel-paper {padding-top:9px;padding-bottom:9px} #view-inicio .hall-recap,#view-inicio .hall-objective {min-height:155px} #view-inicio .hall-last-session {height:108px} #view-inicio .hall-recap-text strong {font-size:22px} } /* v0.2.4 — SOMENTE PERSONAGENS. Mantém os componentes, reduz a altura da ficha visível e apresenta a arte na proporção real (420 × 510). */ #view-personagens .chapter-header {padding-top:14px;padding-bottom:12px} #view-personagens .chapter-header h1 {font-size:clamp(29px,2.5vw,36px);margin:4px 0} #view-personagens .chapter-header p {margin:0} #view-personagens .chapter-actions {margin-top:7px;margin-bottom:9px} #view-personagens .character-layout {grid-template-columns:minmax(205px,250px) minmax(0,1fr);gap:12px;align-items:start} #view-personagens .character-layout>.paper-section {padding:13px} #view-personagens .character-layout .ink-heading {margin-top:0;margin-bottom:10px} #view-personagens .character-rail {gap:7px} #view-personagens .character-option {min-width:0;padding:5px 7px;gap:9px;min-height:70px} #view-personagens .option-face {flex:0 0 48px;width:48px;height:59px;object-fit:contain;object-position:center;background:#2a231d} #view-personagens .character-option-info {min-width:0;display:block} #view-personagens .character-option strong {font-size:18px;line-height:1.06} #view-personagens .character-option small {font-size:12px;line-height:1.15;margin:2px 0} #view-personagens .sheet-top {gap:16px;padding-bottom:9px;align-items:center} #view-personagens .sheet-face {flex:0 0 121px;width:121px} #view-personagens .sheet-art {display:block;width:121px;height:147px;object-fit:contain;object-position:center;background:#2a231d} #view-personagens .sheet-intro h2 {font-size:clamp(26px,2.8vw,34px);line-height:1.07;margin:3px 0 3px} #view-personagens .sheet-intro p {margin:0 0 7px;font-size:15px;line-height:1.2} #view-personagens .sheet-intro .label-caps {font-size:9px} #view-personagens .sheet-quickfacts {display:flex;flex-wrap:wrap;gap:5px;margin-bottom:9px} #view-personagens .sheet-quickfacts span {background:#e6d1a4;border:1px solid #b59361;padding:3px 6px;font:12px/1.2 Georgia;white-space:nowrap} #view-personagens .sheet-quickfacts b {font-weight:normal;color:#734c2e} #view-personagens .sheet-intro-actions {gap:7px} #view-personagens .sheet-intro-actions .red-button,#view-personagens .sheet-intro-actions .outline-button {padding:6px 9px;font-size:12px} #view-personagens .sheet-intro #roll-result {min-height:0;margin-top:4px;font-size:13px} #view-personagens .section-line {margin:10px 0 7px} #view-personagens .section-line h3 {font-size:21px;margin-bottom:1px} #view-personagens .section-line small {font-size:9px} #view-personagens .vital-grid {gap:9px} #view-personagens .vital-box {padding:8px 10px} #view-personagens .vital-box>span {font-size:12px} #view-personagens .vital-box>strong {font-size:22px;margin:1px 0} #view-personagens .vital-box .mini-meter {height:12px;margin:4px 0} #view-personagens .hp-actions {margin-top:5px} #view-personagens .hp-actions button {padding:2px 3px} #view-personagens .vital-fine {margin-top:4px;font:11px/1.2 Georgia} #view-personagens .ability-grid {gap:6px} #view-personagens .ability {gap:3px;padding:5px 2px;font:11px var(--display)} #view-personagens .ability input {width:min(51px,100%);padding:2px;font-size:19px} #view-personagens .ability button {width:min(51px,100%);padding:2px;font-size:11px} #view-personagens .character-extra {margin-top:12px;border:1px solid #a98a5b;background:#e4cb9888} #view-personagens .character-extra>summary {list-style:none;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;font:17px var(--book);color:#49301f} #view-personagens .character-extra>summary::-webkit-details-marker {display:none} #view-personagens .character-extra>summary:hover {background:#f2dba9} #view-personagens .character-extra[open]>summary {border-bottom:1px solid #aa8959} #view-personagens .character-extra-hint {font:10px var(--display);color:#795838;white-space:nowrap} #view-personagens .character-extra-content {padding:12px} #view-personagens .character-extra-content .form-grid {margin-top:0} #view-personagens .character-extra-content .notes-grid {margin-top:11px} /* O modal PDF é o mesmo dialog existente, com largura especial só quando usado para a ficha. */ .detail-dialog.pdf-dialog {width:min(1020px,calc(100vw - 24px));max-width:none;height:min(91vh,950px);max-height:91vh;padding:16px 18px;overflow:hidden} .pdf-viewer {height:100%;min-height:0;display:flex;flex-direction:column;gap:9px} .pdf-viewer-head {display:flex;justify-content:space-between;align-items:center;gap:15px;padding-right:28px} .pdf-viewer-head h2 {font:26px/1.1 var(--book);margin:4px 0} .pdf-viewer iframe {display:block;width:100%;flex:1;min-height:190px;border:1px solid #947343;background:#faf5e8} .pdf-viewer>p {font:12px Georgia;margin:0;color:#6c4a30} @media(max-width:780px) { #view-personagens .character-layout {grid-template-columns:1fr} #view-personagens .character-rail {display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;padding-bottom:3px} #view-personagens .character-option {flex:0 0 192px;min-width:192px} #view-personagens .character-layout>.paper-section {padding:11px} } @media(max-width:520px) { #view-personagens .sheet-top {display:flex;flex-direction:row;align-items:center;gap:9px} #view-personagens .sheet-face {flex:0 0 91px;width:91px} #view-personagens .sheet-art {width:91px;height:111px} #view-personagens .sheet-intro h2 {font-size:24px} #view-personagens .sheet-intro p {font-size:13px} #view-personagens .sheet-quickfacts {gap:3px} #view-personagens .sheet-quickfacts span {font-size:10px;padding:2px 4px} #view-personagens .ability-grid {grid-template-columns:repeat(3,minmax(0,1fr))} #view-personagens .vital-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:5px} #view-personagens .vital-box {padding:7px 5px} #view-personagens .vital-box>strong {font-size:18px} #view-personagens .hp-actions {gap:2px} #view-personagens .hp-actions button {font-size:12px;padding:2px 0} #view-personagens .character-extra>summary {font-size:15px;padding:9px 8px} #view-personagens .character-extra-hint {font-size:9px} .pdf-viewer-head {display:block;padding-right:30px} .pdf-viewer-head a {display:inline-block;margin-top:5px} } /* O conteúdo do dialog precisa herdar a altura para o iframe PDF ocupar o espaço disponível. */ .detail-dialog.pdf-dialog #dialog-content {height:100%;min-height:0} @media (max-height:820px) and (min-width:781px) { #view-personagens .chapter-header {padding-top:6px;padding-bottom:5px} #view-personagens .chapter-actions {margin-top:3px;margin-bottom:2px} } @media (max-height:820px) and (min-width:781px) { #view-personagens .chapter-header {min-height:108px} } /* v0.2.5 — identidade visual local e revisão da tela de Personagens */ .brand{padding:12px 12px 10px;min-height:98px;justify-content:center} .brand-logo{display:block;width:min(188px,100%);height:auto;filter:drop-shadow(0 2px 8px #0008)} .account-badge{padding:6px} .account-badge img{display:block;width:100%;height:100%;object-fit:contain} #view-personagens .character-layout{grid-template-columns:minmax(220px,255px) minmax(0,1fr);align-items:start;gap:12px} #view-personagens .character-layout>.paper-section{padding:12px} #view-personagens .character-option{padding:6px 8px;min-height:74px} #view-personagens .option-face{flex:0 0 48px;width:48px;height:60px;object-fit:cover;object-position:center top;background:#2a231d} #view-personagens .character-option strong{font-size:18px} #view-personagens .character-option small{font-size:12px} #view-personagens .character-sheet-shell{display:grid;gap:12px} #view-personagens .sheet-top-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(255px,29%);gap:12px;align-items:start} #view-personagens .sheet-main-card,#view-personagens .sheet-sidecard{border:1px solid #af8a55;background:#f2dfb9c4;box-shadow:inset 0 0 0 2px #ecd9b4} #view-personagens .sheet-main-card{padding:12px 14px} #view-personagens .sheet-sidecard{padding:12px} #view-personagens .sheet-top{display:flex;align-items:center;gap:14px;padding-bottom:10px;border-bottom:1px solid #ab8b56} #view-personagens .sheet-face{flex:0 0 108px;width:108px} #view-personagens .sheet-art{width:108px;height:132px;display:block;object-fit:cover;object-position:top center;border:3px ridge #987749;background:#2a231d} #view-personagens .sheet-intro h2{font-size:clamp(27px,2.6vw,35px);line-height:1.04;margin:2px 0 4px} #view-personagens .sheet-intro p{margin:0 0 8px;font-size:15px;line-height:1.2} #view-personagens .sheet-quickfacts{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px} #view-personagens .sheet-quickfacts span{background:#e6d1a4;border:1px solid #b59361;padding:3px 7px;font:12px/1.2 Georgia;white-space:nowrap} #view-personagens .sheet-quickfacts b{font-weight:normal;color:#734c2e} #view-personagens .sheet-intro-actions{display:flex;flex-wrap:wrap;gap:7px} #view-personagens .sheet-intro-actions .red-button,#view-personagens .sheet-intro-actions .outline-button{padding:6px 10px;font-size:12px} #view-personagens #roll-result{display:block;margin-top:6px;min-height:18px;color:#7f2b22;font:bold 14px Georgia} #view-personagens .section-line{margin:10px 0 8px} #view-personagens .section-line h3{font-size:20px;margin-bottom:0} #view-personagens .section-line small{font-size:9px} #view-personagens .ability-grid.compact{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px} #view-personagens .ability{gap:3px;padding:5px 2px;font:11px var(--display)} #view-personagens .ability input{width:min(52px,100%);padding:2px;font-size:19px} #view-personagens .ability button{width:min(54px,100%);padding:2px;font-size:11px} #view-personagens .resource-card{padding:10px;border:1px solid #a9885a;background:#ead4a582} #view-personagens .resource-top{display:flex;align-items:flex-end;justify-content:space-between;gap:10px} #view-personagens .resource-top span{font:12px var(--display);color:#6a4a2f} #view-personagens .resource-top strong{font:28px/1 var(--book);color:#442a1b} #view-personagens .resource-card small{display:block;font:12px Georgia;color:#755338;margin-top:2px} #view-personagens .resource-card .mini-meter{height:12px;margin:7px 0 9px} #view-personagens .hp-adjuster{display:grid;grid-template-columns:minmax(64px,74px) 1fr 1fr;gap:6px} #view-personagens .hp-adjuster input{width:100%;padding:6px 5px;text-align:center;background:#fff2d1;border:1px solid #a07f53;color:#422d20} #view-personagens .hp-adjuster button{border:1px solid #816141;background:linear-gradient(#f7e4b7,#cfb184);color:#4b3326;padding:6px 4px} #view-personagens .overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:10px} #view-personagens .overview-grid div{padding:7px 8px;border:1px solid #af8a55;background:#f5e5bf} #view-personagens .overview-grid span{display:block;font:10px var(--display);letter-spacing:.6px;color:#7a5a3c;text-transform:uppercase} #view-personagens .overview-grid strong{display:block;font:20px/1.1 var(--book);color:#402919;margin-top:2px} #view-personagens .resource-note{margin:10px 0 0;font:13px/1.35 Georgia;color:#6d5038} #view-personagens .tab-line{margin-top:0} #view-personagens .character-tabs{display:flex;flex-wrap:wrap;gap:6px} #view-personagens .character-tabs button{border:1px solid #a28052;background:#efe0ba;color:#4a3222;padding:7px 10px;font:13px var(--display)} #view-personagens .character-tabs button:hover{background:#f7e8c8} #view-personagens .character-tabs button.active{background:linear-gradient(#6b2d25,#4c231f);border-color:#a57a41;color:#f3dfb6} #view-personagens .character-tab-panel{padding:12px;border:1px solid #a98a5b;background:#f7ecd2} #view-personagens .tab-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} #view-personagens .tab-grid-saves{grid-template-columns:repeat(3,minmax(0,1fr))} #view-personagens .tab-row{padding:8px;border:1px solid #b19265;background:#f1dfb6;min-height:74px} #view-personagens .tab-row span{display:block;font:14px var(--book);color:#4d3625} #view-personagens .tab-row strong{display:block;font:25px/1 var(--book);margin:4px 0 2px;color:#6f241f} #view-personagens .tab-row small{display:block;font:10px var(--display);color:#7f6040} #view-personagens .tab-bullets{margin:0;padding-left:18px;display:grid;gap:6px;font:16px/1.4 var(--book);color:#4b3123} #view-personagens .tab-bullets.columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 18px} #view-personagens .tab-bullets li{break-inside:avoid} #view-personagens .tab-note{margin:10px 0 0;font:13px/1.35 Georgia;color:#6d5038} #view-personagens .tab-paragraphs p{margin:0 0 8px;font:16px/1.45 var(--book);color:#4b3123} #view-personagens .character-extra{margin-top:0;border:1px solid #a98a5b;background:#e4cb9888} #view-personagens .character-extra>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;font:17px var(--book);color:#49301f} #view-personagens .character-extra>summary::-webkit-details-marker{display:none} #view-personagens .character-extra>summary:hover{background:#f2dba9} #view-personagens .character-extra[open]>summary{border-bottom:1px solid #aa8959} #view-personagens .character-extra-hint{font:10px var(--display);color:#795838;white-space:nowrap} #view-personagens .character-extra-content{padding:12px} #view-personagens .character-extra-content .form-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px} #view-personagens .character-extra-content .notes-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:11px} @media(max-width:1080px){ #view-personagens .sheet-top-grid{grid-template-columns:1fr} #view-personagens .sheet-sidecard{order:2} } @media(max-width:780px){ #view-personagens .character-layout{grid-template-columns:1fr} #view-personagens .character-rail{display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;padding-bottom:3px} #view-personagens .character-option{flex:0 0 192px;min-width:192px} #view-personagens .character-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px} #view-personagens .character-tabs button{white-space:nowrap} #view-personagens .tab-grid,#view-personagens .tab-grid-saves{grid-template-columns:repeat(2,minmax(0,1fr))} #view-personagens .character-extra-content .form-grid{grid-template-columns:repeat(3,minmax(0,1fr))} #view-personagens .character-extra-content .notes-grid{grid-template-columns:1fr} } @media(max-width:540px){ .brand{min-height:78px;padding:10px} .brand-logo{width:min(164px,100%)} #view-personagens .sheet-top{align-items:flex-start} #view-personagens .sheet-face{flex:0 0 88px;width:88px} #view-personagens .sheet-art{width:88px;height:108px} #view-personagens .sheet-intro h2{font-size:24px} #view-personagens .sheet-intro p{font-size:13px} #view-personagens .sheet-quickfacts span{font-size:10px;padding:2px 5px} #view-personagens .ability-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))} #view-personagens .hp-adjuster{grid-template-columns:1fr 1fr;gap:5px} #view-personagens .hp-adjuster input{grid-column:1/-1} #view-personagens .overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))} #view-personagens .tab-grid,#view-personagens .tab-grid-saves{grid-template-columns:1fr} #view-personagens .tab-bullets.columns{grid-template-columns:1fr} #view-personagens .character-extra-content .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } /* ========================================================== v0.2.5.1 — CORREÇÃO DE FIDELIDADE DO PREVIEW DE PERSONAGENS Referência aprovada: retrato + identidade/indicadores/PV no topo; 5 guias abaixo; Atributos + Perícias na primeira guia. Nada daqui altera páginas diferentes de #view-personagens. ========================================================== */ #view-personagens .chapter-actions {display:none} #view-personagens .character-layout {grid-template-columns:minmax(208px,266px) minmax(0,1fr);gap:11px;align-items:start} #view-personagens .character-layout>.paper-section {padding:10px} #view-personagens .character-rail {gap:7px} #view-personagens .character-option {min-height:70px;gap:9px;padding:5px 7px} #view-personagens .character-option .option-face {flex:0 0 51px;width:51px;height:56px;object-fit:cover;object-position:center 18%;border:2px ridge #937044;background:#241c16} #view-personagens .character-option-info {min-width:0} #view-personagens .character-option strong {font-size:18px;line-height:1.05} #view-personagens .character-option small {font-size:12px} #view-personagens .character-option i {font-size:10px} #view-personagens .sheet-section {padding:9px!important} #view-personagens .rf-sheet {min-width:0;display:flex;flex-direction:column;gap:0} #view-personagens .rf-sheet-lead {display:grid;grid-template-columns:clamp(164px,19%,238px) minmax(0,1fr);gap:12px;align-items:stretch;min-width:0;padding-bottom:10px} #view-personagens .rf-portrait {min-width:0;max-height:285px;border:3px ridge #967043;background:#221a16;box-shadow:0 2px 4px #23170d64;overflow:hidden;display:flex;align-items:stretch;justify-content:center} #view-personagens .rf-character-art {display:block;width:100%;height:100%;max-height:279px;aspect-ratio:4/5;object-fit:cover;object-position:center 15%;background:#241d19} #view-personagens .rf-overview {display:flex;flex-direction:column;min-width:0;gap:8px} #view-personagens .rf-identity {display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-width:0;border-bottom:1px solid #b18d57;padding-bottom:6px} #view-personagens .rf-person {min-width:0} #view-personagens .rf-person .label-caps {font-size:8px;letter-spacing:1.3px;color:#8c663e} #view-personagens .rf-person h2 {font:clamp(25px,2.6vw,38px)/1.02 var(--book);margin:1px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #view-personagens .rf-person p {font:clamp(13px,1.18vw,17px)/1.2 var(--book);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #view-personagens .rf-person small {font:13px var(--book);color:#6f513b} #view-personagens .rf-identity-actions {flex:0 0 auto;display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end;max-width:248px} #view-personagens .rf-pdf {white-space:nowrap;padding:7px 8px!important;font:10px var(--display)!important;background:#f0ddb3;box-shadow:0 2px 3px #0004} #view-personagens .rf-dice {background:#42291f;color:#efdeb7;border:1px solid #9b7444;padding:5px 7px;font:11px var(--display)} #view-personagens .rf-dice:hover {background:#673025} #view-personagens .rf-overview-bottom {display:grid;grid-template-columns:minmax(0,1.24fr) minmax(220px,.91fr);gap:8px;min-width:0;align-items:stretch} #view-personagens .rf-key-facts,#view-personagens .rf-health {min-width:0;background:#f0dbb1;border:1px solid #b5915b;box-shadow:inset 0 0 0 2px #f7e7c6} #view-personagens .rf-key-facts h3,#view-personagens .rf-health h3 {font:11px var(--display);letter-spacing:.2px;margin:0;padding:5px 8px;border-bottom:1px solid #b99a68;color:#5b412a} #view-personagens .rf-facts {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;padding:6px 5px} #view-personagens .rf-facts>div {min-width:0;min-height:65px;padding:5px 2px;background:#f9e9c6;border:1px solid #c1a57a;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center} #view-personagens .rf-facts span {font:9px/1.15 var(--display);color:#694b2f;min-height:20px;display:flex;align-items:center;justify-content:center} #view-personagens .rf-facts strong {font:clamp(14px,1.28vw,20px)/1 var(--book);color:#3b271b;margin-top:3px;white-space:nowrap} #view-personagens .rf-secondary-facts {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:0 5px 5px} #view-personagens .rf-secondary-facts>div {display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:37px;border:1px solid #c0a16e;background:#f5e2bc} #view-personagens .rf-secondary-facts span {font:12px var(--book);color:#705139;white-space:nowrap} #view-personagens .rf-secondary-facts strong {font:17px var(--book);white-space:nowrap} #view-personagens .rf-health {display:flex;flex-direction:column} #view-personagens .rf-health-numbers {flex:1;display:grid;grid-template-columns:minmax(0,1fr) 75px;align-items:center;text-align:center;gap:7px;padding:5px 7px} #view-personagens .rf-health-numbers strong {font:clamp(18px,1.9vw,27px)/1 var(--book);white-space:nowrap} #view-personagens .rf-health-numbers span {font:11px/1.15 var(--book);padding-left:7px;border-left:1px solid #b89a67;color:#715239} #view-personagens .rf-health-numbers b {display:block;font:18px var(--book);color:#3b271b;margin-top:3px} #view-personagens .rf-health .mini-meter {height:11px;margin:2px 8px 8px;background:#2a1c17} #view-personagens .rf-hp-controls {display:grid;grid-template-columns:52px 1fr 1fr;gap:4px;padding:0 7px 7px} #view-personagens .rf-hp-controls input {width:100%;min-width:0;text-align:center;border:1px solid #bc9965;background:#fff0cc;color:#402c1c;font:16px var(--book);padding:5px 1px} #view-personagens .rf-hp-controls button {min-width:0;border:1px solid #a27b4c;padding:6px 2px;color:#f7e8c9;font:11px var(--book);white-space:nowrap} #view-personagens .rf-hp-controls .rf-damage {background:linear-gradient(#8d3028,#57221e)} #view-personagens .rf-hp-controls .rf-heal {background:linear-gradient(#416b34,#244b2d)} #view-personagens .rf-hp-controls button:hover {filter:brightness(1.15)} #view-personagens .rf-roll-feedback {display:block;min-height:0;font:12px var(--book);color:#802b23;line-height:1.15} #view-personagens .rf-roll-feedback:empty {display:none} #view-personagens .rf-tab-strip {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:0 1px;border-bottom:2px solid #8f6a3a;background:#bfa276} #view-personagens .rf-tab-strip:has(.rf-edit-tab:not([hidden])) {grid-template-columns:repeat(5,minmax(0,1fr))} #view-personagens .rf-tab-strip button {min-width:0;min-height:40px;border:1px solid #ad8b5d;border-bottom:0;background:#e0c69a;color:#4e3423;padding:6px 3px;font:clamp(10px,1.0vw,14px) var(--display);white-space:nowrap} #view-personagens .rf-tab-strip button.active {background:#f4e0b8;color:#43291b;border:2px solid #8f6736;border-bottom:0;font-weight:700;position:relative;top:1px} #view-personagens .rf-tab-strip button:hover:not(.active) {background:#f0d7a9} #view-personagens .rf-tab-strip .rf-edit-tab {grid-column:1/-1;min-height:31px;border-top:1px solid #ad8b5d;background:#533024;color:#eed6ac} #view-personagens .rf-tab-body {min-width:0;background:#f4dfb7;border:1px solid #a58454;border-top:0;box-shadow:inset 0 0 0 3px #e6ca96;padding:7px 10px 10px;min-height:280px} #view-personagens .rf-panel-heading {font:18px var(--book);color:#482e1e;display:flex;align-items:center;gap:9px;border-bottom:1px solid #bb9c6e;margin:0 0 6px;padding-bottom:3px} #view-personagens .rf-panel-heading span {font:10px var(--display);color:#93734b;text-transform:uppercase} #view-personagens .rf-abilities {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px} #view-personagens .rf-ability {min-width:0;display:grid;justify-items:center;border:1px solid #ba9967;padding:3px;background:#f2dcb1} #view-personagens .rf-ability span {font:11px var(--display);color:#64462f} #view-personagens .rf-ability strong {font:19px/1.12 var(--book);background:#fff0ce;color:#3a281e;width:min(60px,100%);text-align:center;border:1px solid #c4a678;padding:2px 0;margin:2px 0 1px} #view-personagens .rf-ability button {font:12px/1.2 Georgia;background:#4b2820;color:#f6e3bd;border:1px solid #9c7440;width:min(60px,100%);padding:3px 0} #view-personagens .rf-ability button:hover {background:#783229} #view-personagens .rf-skill-heading {margin:7px 0 5px} #view-personagens .rf-skills {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:start} #view-personagens .rf-skill-col {min-width:0;display:grid;align-content:start} #view-personagens .rf-skill {width:100%;display:grid;grid-template-columns:11px minmax(0,1fr) auto;align-items:center;text-align:left;gap:5px;padding:4px 5px;border:0;border-bottom:1px solid #c2a77c;background:transparent;color:#4d3423;min-height:25px;font:13px/1.15 var(--book)} #view-personagens .rf-skill:hover {background:#e5c997} #view-personagens .rf-skill i {display:block;width:10px;height:10px;border:1px solid #9d8c72;border-radius:50%;background:#b5a48b} #view-personagens .rf-skill i.is-trained {background:#34723f;border-color:#23592c} #view-personagens .rf-skill span {white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #view-personagens .rf-skill small {font-size:10px;color:#795c3c} #view-personagens .rf-skill b {font:13px Georgia;color:#38271c} #view-personagens .rf-panel-caption {font:11px var(--display);color:#86633f;margin:3px 0 9px} #view-personagens .rf-panel-empty {border:1px dashed #b2915d;padding:16px;color:#6b5038;font:15px/1.45 var(--book)} #view-personagens .rf-saves-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px} #view-personagens .rf-save {display:grid;justify-items:center;gap:4px;border:1px solid #b39364;background:#f6e2bc;padding:12px 8px;color:#432d20} #view-personagens .rf-save strong {font:25px var(--book);color:#6e2a23} #view-personagens .rf-save small {font:11px var(--book)} #view-personagens .rf-save:hover {background:#e3c58f} #view-personagens .rf-lines {margin:0;padding-left:21px;font:17px/1.6 var(--book);display:grid;gap:3px} #view-personagens .rf-lines.two-col {grid-template-columns:repeat(2,minmax(0,1fr))} #view-personagens .rf-notes p {font:16px/1.5 var(--book);margin:0 0 9px} #view-personagens .rf-editor {max-height:min(470px,65vh);overflow:auto;padding:2px} #view-personagens .rf-editor .form-grid {grid-template-columns:repeat(5,minmax(0,1fr))} #view-personagens .rf-editor .notes-grid {grid-template-columns:repeat(3,minmax(0,1fr));margin:12px 0} #view-personagens .rf-editor-proficiency {display:flex;gap:10px 18px;flex-wrap:wrap;border:1px solid #a98a5b;margin:12px 0;padding:10px} #view-personagens .rf-editor-proficiency legend {font:16px var(--book)} #view-personagens .rf-editor-proficiency label {font:12px Georgia;white-space:nowrap} #view-personagens .rf-editor-proficiency input {accent-color:#68251e} /* Adaptação lateral e para celulares. Rolagem apenas se a viewport realmente exigir. */ @media(max-width:1450px) and (min-width:1031px) { #view-personagens .character-layout {grid-template-columns:minmax(190px,240px) minmax(0,1fr)} #view-personagens .rf-sheet-lead {grid-template-columns:clamp(152px,19%,202px) minmax(0,1fr)} #view-personagens .rf-overview-bottom {grid-template-columns:minmax(0,1.15fr) minmax(205px,.85fr)} #view-personagens .rf-facts span {font-size:8px} #view-personagens .rf-facts strong {font-size:17px} #view-personagens .rf-hp-controls {grid-template-columns:44px 1fr 1fr} #view-personagens .rf-hp-controls button {font-size:10px} } @media(max-width:1180px) { #view-personagens .rf-sheet-lead {grid-template-columns:150px minmax(0,1fr)} #view-personagens .rf-portrait {max-height:230px} #view-personagens .rf-character-art {max-height:224px} #view-personagens .rf-overview-bottom {grid-template-columns:1fr} #view-personagens .rf-health {min-height:0} #view-personagens .rf-health-numbers {display:flex;justify-content:space-around;padding:5px} #view-personagens .rf-health .mini-meter {margin:3px 7px} #view-personagens .rf-hp-controls {grid-template-columns:48px 1fr 1fr} #view-personagens .rf-health-numbers strong {font-size:20px} #view-personagens .rf-health-numbers span {font-size:10px;white-space:nowrap} #view-personagens .rf-facts>div {min-height:42px} #view-personagens .rf-secondary-facts>div {min-height:28px} } @media(max-width:1030px) { #view-personagens .rf-sheet-lead {grid-template-columns:clamp(145px,22%,215px) minmax(0,1fr)} #view-personagens .rf-overview-bottom {grid-template-columns:minmax(0,1.2fr) minmax(205px,.9fr)} #view-personagens .rf-portrait {max-height:270px} #view-personagens .rf-character-art {max-height:264px} } @media(max-width:840px) { #view-personagens .character-layout {grid-template-columns:1fr} #view-personagens .character-rail {display:flex;overflow-x:auto} #view-personagens .character-option {flex:0 0 195px} #view-personagens .rf-overview-bottom {grid-template-columns:1fr} #view-personagens .rf-portrait {max-height:250px} #view-personagens .rf-character-art {max-height:244px} } @media(max-width:650px) { #view-personagens .rf-sheet-lead {grid-template-columns:1fr} #view-personagens .rf-portrait {height:194px;max-height:194px} #view-personagens .rf-character-art {width:100%;height:100%;max-height:194px;object-position:center 23%} #view-personagens .rf-identity {align-items:flex-start;flex-wrap:wrap} #view-personagens .rf-person h2 {font-size:27px} #view-personagens .rf-identity-actions {justify-content:flex-start;max-width:100%} #view-personagens .rf-facts {grid-template-columns:repeat(5,minmax(0,1fr))} #view-personagens .rf-facts strong {font-size:15px} #view-personagens .rf-tab-strip button {font-size:10px;padding:5px 2px} #view-personagens .rf-abilities {grid-template-columns:repeat(3,minmax(0,1fr))} #view-personagens .rf-skills {grid-template-columns:repeat(2,minmax(0,1fr))} #view-personagens .rf-saves-grid {grid-template-columns:repeat(2,minmax(0,1fr))} #view-personagens .rf-editor .form-grid {grid-template-columns:repeat(2,minmax(0,1fr))} #view-personagens .rf-editor .notes-grid {grid-template-columns:1fr} } #view-personagens .rf-editor-stats {border:1px solid #a98a5b;display:flex;flex-wrap:wrap;gap:7px 12px;margin:12px 0;padding:9px} #view-personagens .rf-editor-stats legend {font:16px var(--book)} #view-personagens .rf-editor-stats label {display:grid;gap:3px;font:11px var(--display);text-align:center} #view-personagens .rf-editor-stats input {max-width:65px;text-align:center;border:1px solid #a98a5b;background:#fff1cd;color:#39261b;padding:5px} /* Em laptop (1280×800), manter a área de consulta completa dentro da viewport. */ @media (max-height:830px) and (min-width:781px) { #main-content:has(#view-personagens.active) {padding-top:8px;padding-bottom:6px} #view-personagens .chapter-header {min-height:86px;padding:5px 18px;margin-bottom:7px} #view-personagens .chapter-header h1 {margin:2px 0;font-size:31px} #view-personagens .chapter-header p {font-size:15px} #view-personagens .rf-sheet-lead {gap:8px;padding-bottom:7px} #view-personagens .rf-portrait {height:225px;max-height:225px} #view-personagens .rf-character-art {height:219px;max-height:219px} #view-personagens .rf-person .label-caps {font-size:8px} #view-personagens .rf-person h2 {font-size:27px;margin:0 0 2px} #view-personagens .rf-person p {margin:0 0 2px;font-size:13px} #view-personagens .rf-person small {font-size:11px} #view-personagens .rf-identity {padding-bottom:3px} #view-personagens .rf-overview {gap:4px} #view-personagens .rf-key-facts h3,#view-personagens .rf-health h3 {padding:3px 6px;font-size:10px} #view-personagens .rf-facts {padding:3px;gap:2px} #view-personagens .rf-facts>div {min-height:40px;padding:2px 1px} #view-personagens .rf-facts span {min-height:13px;font-size:8px} #view-personagens .rf-facts strong {margin-top:1px;font-size:16px} #view-personagens .rf-secondary-facts {padding:0 3px 3px;gap:3px} #view-personagens .rf-secondary-facts>div {min-height:26px} #view-personagens .rf-secondary-facts span {font-size:10px} #view-personagens .rf-secondary-facts strong {font-size:15px} #view-personagens .rf-health-numbers {padding:3px 4px} #view-personagens .rf-health-numbers strong {font-size:19px} #view-personagens .rf-health .mini-meter {height:9px;margin:2px 5px 4px} #view-personagens .rf-hp-controls {padding:0 4px 4px} #view-personagens .rf-hp-controls input,#view-personagens .rf-hp-controls button {padding:4px 1px} #view-personagens .rf-tab-strip button {min-height:34px;padding:4px 2px} #view-personagens .rf-tab-body {min-height:0;padding:5px 8px 5px} #view-personagens .rf-panel-heading {font-size:16px;margin:0 0 3px;padding-bottom:2px} #view-personagens .rf-ability {padding:2px} #view-personagens .rf-ability strong {font-size:17px;padding:1px 0} #view-personagens .rf-ability button {font-size:11px;padding:2px 0} #view-personagens .rf-skill-heading {margin:5px 0 3px} #view-personagens .rf-skill {min-height:21px;padding:3px 4px;font-size:12px} #view-personagens .rf-skill small {font-size:9px} } /* Ajuste fino: em desktop médio, não reservar 28px vazios abaixo da ficha. */ @media (min-height:831px) and (min-width:781px) { #main-content:has(#view-personagens.active) {padding-top:12px;padding-bottom:0} } /* v0.2.5.2 — botão do mestre sob a lista; logo na proporção do arquivo. */ #view-personagens .add-character {width:100%;margin-top:8px} .account-badge img {object-fit:contain} @media (min-width:1451px) { #view-personagens .rf-sheet-lead {grid-template-columns:clamp(205px,22%,242px) minmax(0,1fr)} } /* v0.2.5.3 — placa de pergaminho para o wordmark da sidebar. */ .brand-logo {display:block;width:min(190px,100%);height:auto;max-height:none;object-fit:contain;object-position:center;filter:none;padding:7px 11px;border:1px solid #a27a45;border-radius:4px;background:radial-gradient(ellipse at 50% 40%,#fbf0d4 0%,#f1deb2 62%,#dcc08a 100%);box-shadow:inset 0 0 0 2px #f8ebcb,inset 0 0 14px #b8935a66,0 2px 7px #000a} /* v0.2.5.3 — Personagens ocupa exatamente a altura da janela no desktop: a página não rola; se a aba ativa exceder o espaço, só ela rola. */ @media (min-width:781px) and (min-height:560px) { .main-column:has(#view-personagens.active) {height:100vh;min-height:0} #main-content:has(#view-personagens.active) {display:flex;flex-direction:column;min-height:0;overflow:hidden} #view-personagens.active {flex:1;min-height:0;display:flex;flex-direction:column} #view-personagens .character-layout {flex:1;min-height:0;grid-template-rows:minmax(0,1fr);align-items:stretch} #view-personagens .character-layout>aside {min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-personagens .character-rail {flex:0 1 auto;min-height:0;overflow-y:auto;align-content:start} #view-personagens .add-character {flex:none} #view-personagens .sheet-section {min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-personagens .rf-sheet {flex:1;min-height:0} #view-personagens .rf-tab-body {flex:1;min-height:120px;overflow-y:auto} } /* v0.2.5.3 — modal de criação/edição de personagem. */ .detail-dialog.form-dialog {width:min(980px,calc(100vw - 32px));max-width:min(980px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;overflow:hidden} .form-dialog #dialog-content {padding:0} .rf-char-form {display:flex;flex-direction:column;max-height:calc(100vh - 42px);color:#38281a} .rf-form-head {display:grid;grid-template-columns:86px minmax(0,1fr);gap:16px;align-items:center;padding:16px 56px 13px 20px;border-bottom:2px solid #ab8b56;background:linear-gradient(180deg,#f7e8c4,#ecd5a6)} .rf-form-head.is-plain {grid-template-columns:minmax(0,1fr)} .rf-form-head h2 {margin:2px 0 3px;font:30px/1.05 var(--book);color:#3a2616} .rf-form-head p {margin:0;font:14px var(--book);color:#6f5236} .rf-form-portrait {width:86px;height:98px;border:3px ridge #8f6b3c;background:#d9bf8c;overflow:hidden} .rf-form-portrait img,.rf-form-portrait .rf-form-art {width:100%;height:100%;object-fit:cover;object-position:top center;display:block} .rf-form-body {flex:1;min-height:0;overflow-y:auto;padding:14px 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;background:#f4e4bd} .rf-form-block {margin:0;min-width:0;padding:9px 12px 12px;border:1px solid #a98a58;background:#f8ebcb;box-shadow:inset 0 0 0 3px #efdcb0} .rf-form-block legend {padding:0 7px;font:12px var(--display);letter-spacing:1.4px;text-transform:uppercase;color:#7c4a26} .rf-form-block:nth-of-type(n+5) {grid-column:1/-1} .rf-form-grid {display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 10px} .rf-form-texts {grid-template-columns:repeat(3,minmax(0,1fr))} .rf-form-files {grid-template-columns:repeat(2,minmax(0,1fr))} .rf-char-form .data-field {display:flex;flex-direction:column;gap:3px;font:11px var(--display);letter-spacing:.6px;color:#6a4a2e} .rf-char-form input[type=text],.rf-char-form input[type=number],.rf-char-form textarea {width:100%;box-sizing:border-box;padding:6px 8px;border:1px solid #a98a58;border-radius:2px;background:#fffaf0;color:#2f2116;font:15px var(--book)} .rf-char-form textarea {resize:vertical;min-height:84px} .rf-char-form input:focus,.rf-char-form textarea:focus {outline:2px solid #9c3a2a;outline-offset:0;border-color:#9c3a2a} .rf-form-stats {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px} .rf-form-stats label {display:flex;flex-direction:column;align-items:center;gap:3px;font:12px var(--display);color:#6a4a2e} .rf-form-stats input {text-align:center;font-size:19px!important;font-weight:600} .rf-form-checks {display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px 10px} .rf-form-check {display:flex;align-items:center;gap:6px;font:14px var(--book);color:#3a2616;align-self:end;min-height:30px} .rf-form-check input {accent-color:#8f2a1f;width:15px;height:15px} .rf-form-error {margin:0;padding:0 20px;min-height:0;font:14px var(--book);color:#9b2418;background:#f4e4bd} .rf-form-error:not(:empty) {padding:8px 20px;border-top:1px solid #c79a8a} .rf-form-actions {display:flex;align-items:center;gap:10px;padding:12px 20px;border-top:2px solid #ab8b56;background:linear-gradient(180deg,#ecd5a6,#e2c58f)} .rf-form-spacer {flex:1} .rf-form-delete {color:#8f2a1f} .rf-form-delete[data-armed=true] {font-weight:700;text-decoration:underline} .rf-char-form .red-button,.rf-char-form .outline-button {display:inline-flex} @media (max-width:780px) { .rf-form-body,.rf-form-texts,.rf-form-files {grid-template-columns:1fr} .rf-form-stats {grid-template-columns:repeat(3,minmax(0,1fr))} } .rf-file {display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0} .rf-file>span:first-child {font:12px var(--display);letter-spacing:.6px;color:#6a4a2e} .rf-file-pick {position:relative;overflow:hidden;cursor:pointer} .rf-file-pick input {position:absolute;inset:0;opacity:0;cursor:pointer} .rf-file-name {font:15px var(--book);color:#5c412c;word-break:break-word} .rf-file-clear {border:0;background:none;padding:0;color:#8f2a1f;font:14px var(--book);text-decoration:underline} .rf-file-hint {margin:8px 0 0;font:13px var(--book);color:#6f5236} /* v0.2.5.4 — retrato acompanha as informações ao lado; texto do resumo maior, caixas no mesmo tamanho. */ @media (min-width:781px) { #view-personagens .rf-sheet-lead {grid-template-columns:clamp(124px,14%,168px) minmax(0,1fr);align-items:stretch;padding-bottom:4px} #view-personagens .rf-portrait {position:relative;height:auto;min-height:0;max-height:none} #view-personagens .rf-overview {position:relative} #view-personagens .rf-roll-feedback {position:absolute;z-index:2;top:62px;right:0;max-width:60%;padding:3px 9px;border:1px solid #b18d57;background:#f7e6c0;box-shadow:0 2px 4px #0003;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #view-personagens .rf-roll-feedback:empty {display:none!important} #view-personagens .rf-character-art {position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto} #view-personagens .rf-person .label-caps {font-size:11px} #view-personagens .rf-person p {font-size:16px} #view-personagens .rf-person small {font-size:15px} #view-personagens .rf-key-facts h3,#view-personagens .rf-health h3 {font-size:13px} #view-personagens .rf-facts span {font-size:12px;min-height:0;line-height:1.15} #view-personagens .rf-facts strong {font-size:18px} #view-personagens .rf-secondary-facts span {font-size:14px} #view-personagens .rf-secondary-facts strong {font-size:17px} #view-personagens .rf-health-numbers span {font-size:13px} #view-personagens .pdf-empty {font:14px var(--book);color:#6b4e34} } .rf-char-form select {width:100%;box-sizing:border-box;padding:6px 8px;border:1px solid #a98a58;border-radius:2px;background:#fffaf0;color:#2f2116;font:15px var(--book)} .npc-stats {display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px} .npc-stats span {min-width:78px;padding:6px 8px;border:1px solid #b5915b;background:#f8ebcb;text-align:center} .npc-stats small {display:block;font:10px var(--display);letter-spacing:.4px;color:#6a4a2e} .npc-stats strong {font:18px var(--book);color:#3b271b} .npc-stats p {flex:1 0 100%;margin:2px 0 0;font:15px/1.4 var(--book)} .npc-pdf {margin-top:12px} .npc-detail-actions {margin:8px 0 20px;padding-top:22px} .npc-pdf,.npc-detail-actions .outline-button {display:inline-flex} .npc-hidden {display:inline-block;margin-left:6px;font:10px var(--display);letter-spacing:.4px;color:#8f2a1f} #view-npcs .npc-image {flex-basis:107px} #view-npcs .npc-portrait {width:107px;height:130px;object-fit:contain;object-position:center;background:#2a231d} .detail-dialog .npc-detail-art {width:195px;height:auto;aspect-ratio:420/510;max-height:250px;object-fit:contain;object-position:center;background:#2a231d} #npc-form .rf-form-portrait {width:84px;height:102px} #npc-form .rf-form-art {object-fit:contain;object-position:center;background:#2a231d} @media (min-width:781px) and (min-height:560px) { .main-column:has(#view-npcs.active) {height:100vh;min-height:0} #main-content:has(#view-npcs.active) {display:flex;flex-direction:column;min-height:0;overflow:hidden} #view-npcs.active {flex:1;min-height:0;display:flex;flex-direction:column} #view-npcs .paper-section {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-npcs .npc-grid {flex:1;min-height:0;overflow-y:auto;align-content:start;padding-right:4px} } .sidebar {background:linear-gradient(105deg,rgba(255,255,255,.05),transparent 35%),repeating-linear-gradient(92deg,#3f3026 0 5px,#43342a 6px 9px)} .nav-link {background:transparent;border-bottom-color:#a07a4a4d;padding:7px 12px;gap:13px} .main-nav {gap:4px} .nav-link[data-view="inicio"] .nav-icon img {transform:translateY(-9%)} .nav-link[data-view="inicio"]:hover .nav-icon img {transform:translateY(-9%) scale(1.06)} .mini-cover {width:36px;height:36px;flex-basis:36px}.mini-cover img {width:36px;height:36px} .account-badge {width:46px;height:46px;padding:3px} .nav-link:hover {background:#ffffff12} .nav-link small {color:#cdb898} .sidebar-caption {color:#c7a26b} .sidebar-bottom {background:#2c221b} @media (max-height:800px) { .nav-icon {width:44px;height:44px;flex-basis:44px} .nav-link {padding:6px 12px} } @media (max-height:700px) { .nav-icon {width:38px;height:38px;flex-basis:38px} .nav-link {padding:5px 12px} } @media (max-height:630px) { .nav-icon {width:32px;height:32px;flex-basis:32px} .nav-link {padding:3px 10px} } .main-nav {flex:1 1 auto;min-height:0;display:grid;grid-template-rows:repeat(9,minmax(0,1fr));align-content:stretch;gap:2px;padding:2px 8px} .nav-link {min-height:0;height:auto;padding-top:2px;padding-bottom:2px} @media (max-height:630px) { .sidebar {overflow-y:auto} .nav-link {min-height:36px} } .atlas-tabs {flex-wrap:wrap;align-items:center} .atlas-tabs button[data-map] {display:inline-flex;align-items:center;gap:7px} .atlas-tabs button[data-map] img {width:22px;height:22px;object-fit:contain} .atlas-tabs .atlas-add {width:auto;height:auto;padding:6px 12px} .atlas-actions {display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap} .map-blurb {margin:0 0 8px;font:14px/1.35 var(--book);color:#6d513d} .atlas-kicker {margin:0 0 6px;font:16px/1.3 var(--book);font-weight:normal;color:#e7d3ad;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .atlas-board-top {margin-bottom:16px} .atlas-board .atlas-actions {flex:1;justify-content:flex-start} .atlas-side-head select {width:auto;max-width:210px;min-width:148px;padding:7px 8px;border:1px solid #9b7c52;border-radius:0;background:#fff1cd;color:#3b281d;font:14px Georgia} .atlas-board .atlas-controls {margin-left:auto} .atlas-controls .atlas-tool {width:auto;min-width:30px;padding:0 8px;font:11px var(--display);letter-spacing:0} .map-viewport {display:flex;justify-content:safe center;align-items:safe center} .map-stage {min-width:0;flex:0 0 auto} #map-form .rf-form-portrait {width:140px;height:84px;box-sizing:content-box;background:#214a56} #map-form .rf-form-art {object-fit:contain;object-position:center;background:#214a56} .map-markers.is-hidden {visibility:hidden} .map-viewport.placing {outline:2px solid #c5953f;cursor:crosshair} .detail-dialog.map-dialog {display:flex;flex-direction:column;width:min(1280px,calc(100vw - 28px));max-width:none;height:min(92vh,900px);max-height:92vh;padding:16px;overflow:hidden} .detail-dialog.map-dialog #dialog-content {flex:1;min-height:0;display:flex} .map-viewer {flex:1;min-width:0;min-height:0;display:flex;flex-direction:column} .map-viewer-body {flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 230px;grid-template-rows:minmax(0,1fr);gap:10px} .map-legend {min-height:0;overflow-x:hidden;overflow-y:auto;padding:10px 10px 12px;background:#f6e7c4;border:1px solid #a98a58;color:#3c291c} .map-legend h3 {margin:0 0 8px;font:18px var(--book)} .map-legend [data-legend] {display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:transparent;border:0;border-bottom:1px solid #a480545e;color:#442c1b;padding:7px 2px;font:16px var(--book)} .map-legend [data-legend].active,.map-legend [data-legend]:hover {background:#fff0c49e} .map-legend-entry.is-open [data-legend] {border-bottom:0} .map-legend img {width:22px;height:28px;object-fit:contain;flex:0 0 22px} .map-legend p {margin:8px 0;font:15px var(--book)} .map-legend-entry,.map-legend-fold {min-width:0;max-width:100%} .map-legend-fold {padding:4px 4px 10px 32px;border-bottom:1px solid #a480545e;overflow-wrap:anywhere} .map-legend-fold em {display:block;font:14px var(--book);color:#895c39} .map-legend-fold p {margin:6px 0 8px;font:15px/1.4 var(--book)} .map-legend-fold .outline-button {display:inline-flex} .map-place-dock {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:8px;padding:8px 10px;background:#f6e7c4;border:1px solid #a98a58;color:#3c291c} .map-place-dock p {margin:0;font:15px var(--book)} .map-place-confirm {display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1 0 100%} .map-place-confirm p {margin:0;font:17px var(--book)} .map-place-confirm-actions {display:flex;gap:8px} .map-marker.is-draft {cursor:grab;z-index:5;touch-action:none} .map-marker.is-draft.is-dragging {cursor:grabbing} .map-viewer-bar {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 42px 8px 0} .map-viewer-bar h2 {margin:0;font:24px var(--book)} .map-viewer-viewport {flex:1;min-height:0;overflow:auto;display:flex;align-items:safe center;justify-content:safe center;background:#214a56;border:4px ridge #755d40} .map-viewer-stage {position:relative;flex:0 0 auto;line-height:0} .map-viewer-stage img {display:block;width:100%;height:100%;object-fit:contain;object-position:center} .map-viewer-stage .map-markers {position:absolute;inset:0} .map-marker {width:36px;height:46px;padding:0;clip-path:none;background:transparent;filter:drop-shadow(0 2px 2px #000a);transform:translate(-50%,-100%)} .map-marker img {width:100%;height:100%;object-fit:contain;display:block;pointer-events:none} .map-marker:hover,.map-marker.selected {background:transparent;filter:drop-shadow(0 0 5px #e8c27c) drop-shadow(0 2px 2px #000a);scale:1.08} .location-pin {width:26px;height:32px;object-fit:contain;flex:0 0 26px} .location-item i {flex:0 0 16px;width:16px;height:16px;display:grid;place-items:center;font-size:16px;line-height:1;transition:transform .15s ease} .location-entry.is-open .location-item i {transform:rotate(90deg)} .location-entry,.location-fold,.location-item {min-width:0;max-width:100%} .location-fold {padding:2px 8px 12px 42px;border-bottom:1px solid #a480545e;overflow-wrap:anywhere} .location-fold .outline-button {max-width:100%;white-space:normal} .location-fold em {display:block;font:14px var(--book);color:#895c39} .location-fold p {margin:6px 0 10px;font:16px/1.42 var(--book)} .atlas-side-head {display:flex;align-items:center;justify-content:space-between;gap:8px} .atlas-side-head .ink-heading {margin:0} .atlas-detail-actions {display:flex;flex-wrap:wrap;gap:6px;margin-top:10px} .map-empty {margin:8px 0;font:15px var(--book);color:#6d513d} @media (min-width:781px) and (min-height:560px) { .main-column:has(#view-atlas.active) {height:100vh;min-height:0} #main-content:has(#view-atlas.active) {display:flex;flex-direction:column;min-height:0;overflow:hidden} #view-atlas.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-atlas .atlas-kicker {flex:0 0 auto} #view-atlas .atlas-tabs {flex:0 0 auto;margin:8px 0} #view-atlas .atlas-layout {flex:1;min-height:0;align-items:stretch;grid-template-columns:minmax(0,1fr) minmax(300px,340px)} #view-atlas .atlas-board,#view-atlas .atlas-side {min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-atlas .map-viewport {flex:1;min-height:0;max-height:none;overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable} #view-atlas #location-list {flex:1;min-height:0;overflow-x:hidden;overflow-y:auto} } #view-cronicas .chronicle-chapter {display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:0;margin-bottom:8px;padding:12px 18px} #view-cronicas .chronicle-chapter h1 {font-size:32px;margin:2px 0} #view-cronicas .chronicle-chapter p {margin:0} .chronicle-volume {display:inline;margin-right:8px;padding-right:8px;border-right:1px solid #a68455;font:12px var(--display);letter-spacing:.4px;color:#7a5430} .chronicle-actions {display:flex;align-items:center;gap:8px;flex:0 0 auto} body:not(.gm-active) #view-cronicas .chronicle-actions {display:none} .chronicle-row {min-width:0;max-width:100%} .chronicle-row.is-archived {opacity:.72} .chronicle-row.is-archived strong {font-style:italic} #view-cronicas .book-title {padding-bottom:6px;margin-bottom:8px} #view-cronicas .book-title > span {font-size:14px} #view-cronicas .book-title h2 {font:20px/1.1 var(--book)} #view-cronicas .book-title small {font-size:9px} #view-cronicas .chronicle-lead {display:grid;grid-template-columns:minmax(150px,38%) minmax(0,1fr);gap:14px;align-items:stretch;margin-bottom:4px} #view-cronicas .chronicle-illustration:not(.missing-image) {width:100%;height:auto;min-height:0;max-height:190px;aspect-ratio:auto;margin:0;object-fit:contain;object-position:center;align-self:start;background:transparent} #view-cronicas .chronicle-illustration.missing-image {min-height:118px} #view-cronicas .chronicle-thumb {object-fit:contain;object-position:center;background:transparent} #view-cronicas .chronicle-illustration.missing-image {display:grid;place-items:center;font-size:24px} .chronicle-volume-head {margin:8px 4px 2px;padding-bottom:3px;border-bottom:1px solid #a3825369;font:11px var(--display);letter-spacing:.8px;text-transform:uppercase;color:#7c5434} .chronicle-volume-head:first-child {margin-top:0} .chronicle-preview-go {margin-top:14px} .chronicle-preview-go .fineprint {margin:6px 0 0} .chronicle-preview-kicker {display:flex;align-items:center;gap:6px} .chronicle-preview-kicker img {width:18px;height:23px;object-fit:contain} .chronicle-preview .chronicle-preview-map {width:195px;height:auto;aspect-ratio:1600/960;max-height:160px;object-fit:contain;object-position:center;background:#214a56} #view-cronicas .chronicle-lead h3 {margin:2px 0 4px;font-size:24px} #view-cronicas .chronicle-lead p {margin:0} .chronicle-thumb {object-fit:cover;object-position:center} .chronicle-detail {overflow-wrap:anywhere} .chronicle-detail p {white-space:pre-wrap} .chronicle-block {margin-top:12px} .chronicle-block h4 {margin:0 0 4px;font:18px var(--book);color:#6f3a22} .chronicle-block p {margin:0} .chronicle-motive {margin-top:10px;padding-top:8px;border-top:1px solid #a58854} .chronicle-relations {display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px} .chronicle-relations > span {font:11px var(--display);letter-spacing:.6px;color:#7c5434} .chronicle-relations button {border:1px solid #a18151;background:#f5e7c7;color:#3b281d;font:14px var(--book);padding:3px 8px} .chronicle-relations button:hover {background:#fff2ce} .chronicle-secret {margin-top:16px;padding:10px 12px;border:1px dashed #8f2a1f;background:#f3d7b4} .chronicle-secret h4 {margin:0 0 4px;font:18px var(--book);color:#8f2a1f} .chronicle-secret p {margin:0;white-space:pre-wrap} .chronicle-empty {margin:8px 0;font:15px var(--book);color:#6d513d} #session-form .rf-form-body {grid-template-columns:minmax(0,1fr)} #session-form .rf-form-texts {grid-template-columns:1fr 1fr} .session-form-preview {width:min(100%,360px);aspect-ratio:1.62/1;border:3px double #937048;overflow:hidden;margin-bottom:8px;background:#d9bf8c} .session-form-preview img,.session-form-preview .session-form-art {width:100%;height:100%;object-fit:contain;object-position:center;display:block} .chronicle-link-box {max-height:132px;overflow:auto;align-content:start} .beast-form-preview {width:min(100%,280px);aspect-ratio:900/620;border:3px double #937048;overflow:hidden;margin-bottom:8px;background:#d9bf8c} .beast-form-preview img,.beast-form-preview .beast-form-art {width:100%;height:100%;object-fit:contain;object-position:center;display:block} #edit-beast:disabled {opacity:.45} .tavern-presets {display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 8px} .tavern-preset {border:1px solid #a18151;background:#f5e7c7;color:#3b281d;font:14px var(--book);padding:4px 10px} .tavern-preset.active {background:#6d2e26;color:#f6e2c2;border-color:#3c2119} .tavern-spotify-form {flex-wrap:wrap;align-items:center} #view-taverna .data-field {display:flex;flex-direction:column;gap:3px;margin:0 0 8px;font:11px var(--display);letter-spacing:.6px;color:#6a4a2e} .tavern-spotify-form .data-field {flex:1 1 100%} .tavern-preset-tools {display:flex;align-items:center;gap:12px;margin:0 0 8px} body:not(.gm-active) .tavern-edit {display:none !important} .spotify-list {display:flex;flex-direction:column;gap:4px;margin:0 0 8px} .spotify-list:empty {display:none} .spotify-item {display:flex;align-items:flex-start;gap:8px} .spotify-pick {flex:1;display:flex;flex-direction:column;align-items:flex-start;text-align:left;border:1px solid #a18151;background:#f5e7c7;color:#3b281d;font:15px var(--book);padding:6px 10px} .spotify-pick small {display:block;font:13px var(--book);color:#71513a;line-height:1.35} .spotify-item.active .spotify-pick {background:#6d2e26;color:#f6e2c2;border-color:#3c2119} .spotify-item.active .spotify-pick small {color:#f0d7b4} .spotify-item .minor-link {margin-top:6px} .mini-playlist {display:block;width:140px;flex:0 0 140px;margin:0;height:28px;border:1px solid #a18151;background:#f8ecd0;color:#24160f;font:13px var(--book);padding:0 6px;color-scheme:light} .mini-playlist[hidden] {display:none} .mini-preset {display:block;width:auto;max-width:160px;flex:0 1 160px;height:28px;border:1px solid #a18151;background:#f8ecd0;color:#24160f;font:12px var(--display);letter-spacing:.3px;padding:0 6px;text-overflow:ellipsis;color-scheme:light} .mini-preset option,.mini-playlist option {background:#f8ecd0;color:#24160f} select {color-scheme:light} select option {background:#fff1cd;color:#3b281d} .audio-playlist:empty {display:none;margin:0} #view-taverna .tavern-layout > .paper-section:last-child {overflow-y:hidden} .map-viewport,.map-viewer-viewport {scrollbar-color:#9a7546 transparent} @media (min-width:781px) { .main-column:has(#view-taverna.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-taverna.active) {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:10px} #view-taverna.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-taverna .tavern-chapter {flex:0 0 auto;min-height:0;margin-bottom:8px;padding:0} #view-taverna .tavern-chapter h1 {font-size:32px;margin:2px 0} #view-taverna .tavern-presets {flex:0 0 auto} #view-taverna .tavern-layout {flex:1;min-height:0;grid-template-rows:minmax(0,1fr)} #view-taverna .paper-section {min-height:0;overflow:auto} #view-taverna .spotify-embed {height:352px} } :is(#view-personagens,#view-npcs,#view-atlas,#view-cronicas,#view-bestiario,#view-missoes,#view-combate,#view-taverna) .chapter-header.section-banner {display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,46%);grid-template-rows:1fr;align-items:stretch;flex:0 0 auto;min-height:0;height:clamp(132px,17vh,157px);aspect-ratio:auto;margin-bottom:8px;padding:0;overflow:hidden} .section-banner-copy {grid-column:1;grid-row:1;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:none;min-width:0;padding:12px 16px 12px 18px} .section-banner-copy > :first-child {min-width:0} .section-banner-art {grid-column:2;grid-row:1;height:100%;width:100%;aspect-ratio:auto;margin:0;background-repeat:no-repeat;background-position:right center;background-size:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 16%);mask-image:linear-gradient(90deg,transparent,#000 16%)} .banner-personagens {background-image:url('../assets/images/banner_personagens.webp')} .banner-npcs {background-image:url('../assets/images/banner_npcs.webp')} .banner-atlas {background-image:url('../assets/images/banner_atlas.webp')} .banner-cronicas {background-image:url('../assets/images/banner_cronicas.webp')} .banner-bestiario {background-image:url('../assets/images/banner_bestiario.webp')} .banner-missoes {background-image:url('../assets/images/banner_missoes.webp')} .banner-combate {background-image:url('../assets/images/banner_combate.webp')} .banner-taverna {background-image:url('../assets/images/banner_taverna.webp')} #view-atlas .section-banner-copy {overflow:hidden} #view-atlas .section-banner .atlas-kicker {width:100%;max-width:100%;min-width:0;color:inherit;white-space:normal;overflow:hidden;margin:0;font:20px/1.25 var(--book)} .section-banner h1 {font-size:32px;margin:2px 0} .section-banner p {margin:0} #view-combate .section-banner.combat-chapter p {display:block} @media (max-width:780px) { :is(#view-personagens,#view-npcs,#view-atlas,#view-cronicas,#view-bestiario,#view-missoes,#view-combate,#view-taverna) .chapter-header.section-banner {height:clamp(132px,17vh,157px);aspect-ratio:auto;grid-template-columns:minmax(0,1fr) minmax(42%,52%)} .section-banner-art {grid-column:2;width:100%;height:100%;aspect-ratio:auto} .section-banner-copy {padding:12px 12px 10px 14px} } .quest-chapter {display:flex;align-items:center;justify-content:space-between;gap:16px} .quest-layout {display:grid;grid-template-columns:minmax(340px,460px) minmax(0,1fr);gap:13px} .quest-index {padding:16px 14px 14px} .quest-filters {display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 10px} .quest-filter.active {border-color:#c39054;background:linear-gradient(#8e3d32,#5c231b);color:#ffebc3;text-shadow:0 1px #23140d} .quest-group {margin:0 0 12px} .quest-group h3 {margin:0 0 6px;font:16px var(--book);color:#6a4528} .quest-row {width:100%;display:flex;flex-direction:row;align-items:center;gap:10px;border:1px solid #a3885e;background:#f6e5be;color:#38281a;text-align:left;padding:6px 10px;margin:0 0 6px} .quest-row img {width:42px;height:42px;flex:0 0 42px;object-fit:contain;filter:drop-shadow(0 1px 2px #2a180eb3)} .quest-row span {min-width:0;display:flex;flex-direction:column;gap:2px} .quest-lead {display:flex;align-items:flex-start;gap:14px;margin-bottom:8px} .quest-lead img {width:92px;height:92px;flex:0 0 92px;object-fit:contain;filter:drop-shadow(0 2px 3px #2a180eb3)} .quest-row.active {box-shadow:inset 0 0 0 2px #9c7543;background:#e7c995} .quest-row small,.quest-meta {color:#71513a;font:12px var(--book)} .quest-steps {list-style:none;margin:8px 0;padding:0;display:grid;gap:6px} .quest-steps label {display:flex;align-items:flex-start;gap:8px;font:16px var(--book)} .quest-history {margin:8px 0 0;padding:0;list-style:none;display:grid;gap:4px} .quest-history li {font:14px var(--book);color:#5c4030} .quest-status-row {display:flex;flex-wrap:wrap;gap:6px;margin:10px 0} body:not(.gm-active) #view-missoes .chronicle-actions {display:none} #edit-quest:disabled {opacity:.45} @media (min-width:781px) { .main-column:has(#view-missoes.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-missoes.active) {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:10px} #view-missoes.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-missoes .quest-chapter {flex:0 0 auto;min-height:0;margin-bottom:8px;padding:12px 18px} #view-missoes .quest-chapter h1 {font-size:32px;margin:2px 0} #view-missoes .quest-layout {flex:1;min-height:0} #view-missoes .quest-index,#view-missoes .quest-detail {min-height:0;overflow:auto} } @media (max-width:780px) { .quest-layout {grid-template-columns:1fr} } body:not(.gm-active) #view-combate .chronicle-actions {display:none} .combat-chapter {display:flex;align-items:center;justify-content:space-between;gap:14px} .combat-board {min-height:0} .combat-empty {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:320px;border:4px ridge #755d40;background:radial-gradient(circle at 50% 40%,#3b2b20,#1d1611);color:#e9d6b0;text-align:center} .combat-empty img {width:96px;height:96px;object-fit:contain;opacity:.85} .combat-empty p {margin:6px 0 0;font:22px var(--book)} .combat-empty small {font:14px var(--book);color:#c8ad82} .combat-arena {display:flex;flex-direction:column;gap:8px;height:100%;min-height:0;padding:10px;border:4px ridge #755d40;background:radial-gradient(ellipse at 50% 30%,#3d2c21 0%,#261c15 60%,#1b1410 100%);box-shadow:inset 0 0 40px #000a} .combat-top {display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;flex:0 0 auto} .combat-title {display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0} .combat-title h2 {margin:0;font:24px var(--book);color:#f6e4bd;text-shadow:0 1px 2px #000} .combat-title h2[contenteditable="true"] {cursor:text;border-bottom:1px dashed #a88a5c} .combat-round {padding:3px 10px;border:1px solid #c49b5b;background:#5a2a20;color:#fbe3ae;font:12px var(--display);letter-spacing:.8px} .combat-round.is-done {background:#3a332b;border-color:#8a7b62;color:#d8cbb2} .combat-switch {max-width:220px;padding:4px 6px;border:1px solid #9b7c52;border-radius:0;background:#fff1cd;color:#3b281d;font:14px Georgia;color-scheme:light} .combat-turn-controls {display:flex;align-items:center;gap:6px;flex:0 0 auto;padding:4px;border:1px solid #6e5638;background:#140f0c} .combat-turn-controls .combat-next {min-height:36px;padding:7px 16px;font-size:14px} .combat-turn-controls button:disabled {opacity:.4;cursor:default;filter:none} .combat-tools {display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:0 0 auto} .combat-tools .is-open {background:linear-gradient(#8e3d32,#5c231b);color:#ffebc3;text-shadow:0 1px #23140d} .combat-tools .minor-link {margin-left:auto} .combat-chronicle {display:flex;flex-direction:row;align-items:center;gap:6px;margin:0;font:11px var(--display);letter-spacing:.4px;color:#e7d3ab} .combat-chronicle select {max-width:240px;padding:4px 6px;border:1px solid #9b7c52;border-radius:0;background:#fff1cd;color:#3b281d;font:14px Georgia;color-scheme:light} .combat-add {position:static;z-index:1;display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap;width:100%;padding:10px 12px;border:3px ridge #8e6d42;background:#f4e3bd;box-shadow:none} .combat-add-lead {flex:1 1 100%;margin:0;font:16px var(--book);color:#3b281d} .combat-order {display:flex;gap:5px;margin:0;padding:3px 2px 4px;list-style:none;overflow:hidden;flex:0 0 auto} .combat-order li {flex:0 1 auto;min-width:0} .combat-order li.is-turn {flex-shrink:0} .combat-order button {display:flex;align-items:center;gap:6px;width:100%;min-width:0;padding:3px 9px 3px 3px;border:1px solid #6e5638;border-bottom:3px solid #3f6b4a;background:#2c221a;color:#e6d3ae;font:13px var(--book);max-width:180px} .combat-order li.enemy button {border-bottom-color:#a8392f} .combat-order li.neutral button {border-bottom-color:#a28a4f} .combat-order button b {min-width:22px;font:12px var(--display);color:#d9b675} .combat-order button span {white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .combat-order li.is-turn button {background:linear-gradient(#7a3328,#4c1f19);border-color:#f0c56f;color:#fff3d2;box-shadow:0 0 0 1px #f0c56f,0 0 12px #f0c56f99} .combat-order li.is-down button {opacity:.5;filter:grayscale(.8)} .combat-chip {width:28px;height:28px;flex:0 0 28px;object-fit:contain;object-position:center;background:#2a231d;border-radius:50%;border:1px solid #a88a5c} .combat-chip.missing-image {display:grid;place-items:center;font-size:13px;background:#4a3a2c;color:#d8bd8a} .combat-field {display:grid;grid-template-columns:minmax(230px,1fr) minmax(360px,1.4fr) minmax(230px,1fr);gap:10px;flex:1;min-height:0} .combat-side {min-height:0;overflow-y:auto;padding:12px 8px 8px;border:1px solid #6e5638;background:linear-gradient(#24301f,#1c2419);border-top:4px solid #4f8a5d} .combat-side.combat-enemy {background:linear-gradient(#3a1d18,#2a1512);border-top-color:#b23d31} .combat-side h3 {display:flex;align-items:center;justify-content:space-between;margin:2px 2px 8px;font:13px var(--display);letter-spacing:1.4px;text-transform:uppercase;color:#bfe0c3} .combat-enemy h3 {color:#f2b7a8} .combat-side h3 small {font:12px var(--book);color:inherit;opacity:.75} .combat-side h3 + .combat-card ~ h3,.combat-side .combat-none + h3 {margin-top:14px} .combat-none {margin:4px 2px 10px;font:14px var(--book);color:#b8a587} .combat-card {position:relative;display:flex;align-items:center;gap:9px;margin:0 0 7px;padding:7px 58px 7px 7px;border:1px solid #a3885e;border-left:5px solid #3f7a4e;background:#f7ead0;color:#38281a;cursor:pointer;transition:transform .12s,box-shadow .12s} .combat-card:hover {transform:translateX(2px)} .combat-card.enemy {border-left-color:#a8392f;background:#f8e2d9} .combat-card.enemy:hover {transform:translateX(-2px)} .combat-card.neutral {border-left-color:#a28a4f} .combat-card.active {box-shadow:inset 0 0 0 2px #9c7543} .combat-card.is-turn {border-color:#e6b65d;box-shadow:0 0 0 2px #f0c56f,0 0 16px #f0c56fcc;background:#fff4d8;animation:combat-turn 1.8s ease-in-out infinite} .combat-card.is-target {box-shadow:0 0 0 2px #c0392b,0 0 12px #c0392b99} .combat-card.is-down {filter:grayscale(.9);opacity:.6} @keyframes combat-turn {50% {box-shadow:0 0 0 2px #f0c56f,0 0 26px #f0c56f}} @media (prefers-reduced-motion:reduce) {.combat-card.is-turn {animation:none}} .combat-flag {position:absolute;top:-8px;right:62px;padding:1px 7px;background:#f0c56f;color:#3a210f;font:10px var(--display);letter-spacing:1px;text-transform:uppercase;border:1px solid #8c6326} .combat-flag.target {background:#c0392b;color:#fff1e4;border-color:#6d1d16} .combat-face {width:50px;height:50px;flex:0 0 50px;object-fit:contain;object-position:center;background:#2a231d;border:2px ridge #88683e} .combat-face.missing-image {display:grid;place-items:center;font-size:20px;background:#e3cfa6;color:#8a6a3e} .combat-card-body {flex:1;min-width:0} .combat-card strong {display:block;font:16px/1.15 var(--book);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .combat-card small {display:block;margin-top:3px;font:12px var(--book);color:#6e4f37} .combat-card em {display:block;font:12px var(--book);color:#8d2f2a} .combat-aim {position:absolute;right:5px;top:50%;transform:translateY(-50%);width:auto;min-width:42px;height:24px;padding:0 6px;border:1px solid #a3885e;border-radius:2px;background:#fffaf0;color:#8d2f2a;font:11px var(--display);letter-spacing:.3px;line-height:1} .combat-aim:hover,.combat-card.is-target .combat-aim {background:#c0392b;color:#fff;border-color:#6d1d16} .combat-hp {display:block;height:6px;margin-top:4px;background:#00000026;border:1px solid #0000002e;overflow:hidden} .combat-hp i {display:block;height:100%;background:#3f8a4f;transition:width .25s} .combat-hp.hp-mid i {background:#c58d2c} .combat-hp.hp-low i {background:#b23a2c} .combat-stage {display:flex;flex-direction:column;gap:8px;min-height:0;padding:10px;border:1px solid #a3885e;background:linear-gradient(135deg,#f4e3bd,#e6cd9d);box-shadow:inset 0 0 0 3px #e9d1a4} .combat-actor {display:flex;gap:12px;align-items:center;flex:0 0 auto;padding-bottom:8px;border-bottom:1px solid #b38b4e66} .combat-actor > p {margin:0;font:15px var(--book);color:#6d513d} .combat-portrait {width:86px;height:86px;flex:0 0 86px;object-fit:contain;object-position:center;background:#2a231d;border:3px ridge #88683e} .combat-portrait.missing-image {display:grid;place-items:center;font-size:30px;background:#e3cfa6;color:#8a6a3e} .combat-actor.is-turn .combat-portrait {border-color:#e6b65d;box-shadow:0 0 12px #f0c56f} .combat-actor-body {flex:1;min-width:0} .combat-actor .label-caps {color:#8d2f2a} .combat-actor.ally .label-caps {color:#2f6a3f} .combat-actor h3 {margin:1px 0 2px;font:24px/1.1 var(--book);color:#2f2116} .combat-actor .combat-hp {height:9px} .combat-actor-stats {display:flex;gap:12px;flex-wrap:wrap;margin:5px 0 0;font:13px var(--book);color:#6a4a2e} .combat-actor-stats b {font:16px var(--book);color:#2f2116} .combat-actor-cond {margin:3px 0 0;font:13px var(--book);color:#8d2f2a} .combat-actor .minor-link {padding:2px 0;margin-top:2px} .combat-edit {flex:0 0 auto;font:13px var(--book);color:#6a4a2e} .combat-edit summary {cursor:pointer;color:#663b26} .combat-stats {display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px;margin-top:6px} .combat-stats label,.combat-action label,.combat-add label,.combat-meta label {display:flex;flex-direction:column;gap:2px;font:10px var(--display);letter-spacing:.4px;color:#6a4a2e} .combat-stats input,.combat-stats select,.combat-action input,.combat-action select,.combat-add input,.combat-add select,.combat-meta select {padding:4px 6px;border:1px solid #a98a58;background:#fffaf0;color:#2f2116;font:14px var(--book)} .combat-stats input[type="number"] {width:64px} .combat-conditions {flex:1 1 140px} .combat-conditions input {width:100%} .combat-add input[type="number"] {width:60px} .combat-action {flex:0 0 auto;display:flex;flex-direction:column;gap:7px} .combat-kinds {display:flex;gap:4px;flex-wrap:wrap} .combat-kinds label {display:block;position:relative} .combat-kinds input {position:absolute;opacity:0;pointer-events:none} .combat-kinds span {display:block;padding:5px 12px;border:1px solid #a18151;background:#f8ecd0;color:#4a3322;font:13px var(--book);cursor:pointer} .combat-kinds input:checked + span {background:#6d2e26;color:#f6e2c2;border-color:#3c2119} .combat-kinds input:focus-visible + span {outline:2px solid #9c7543;outline-offset:1px} .combat-action-row {display:flex;align-items:flex-end;gap:8px} .combat-action-row label {min-width:0} .combat-action-row label:first-child {flex:0 1 130px} .combat-action-row label:first-child input {width:100%} .combat-action-row .combat-note {flex:1 1 220px} .combat-action-row label:nth-child(2) {flex:1 1 160px} .combat-action-row select {width:100%;max-width:240px} .combat-action-row .red-button {flex:0 0 auto} .combat-action-row .red-button {min-height:34px;padding:6px 20px;font-size:14px} .combat-result {flex:0 0 auto;display:flex;align-items:center;gap:12px;min-height:58px;padding:6px 12px;border:2px solid #8e6d42;background:#2a1f17;color:#f2deb5} .combat-result b {min-width:56px;text-align:center;font:36px/1 var(--book);color:#f0c56f;text-shadow:0 0 10px #f0c56f66} .combat-result.damage b {color:#ff8f7a} .combat-result.heal b {color:#8fe3a0} .combat-result span {font:14px var(--book)} .combat-result.is-empty {justify-content:center;border-style:dashed;background:#00000012;color:#7a5b40} .combat-log {flex:1;min-height:90px;display:flex;flex-direction:column;border:1px solid #b38b4e88;background:#fbf2dd} .combat-log-head {display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 9px;border-bottom:1px solid #b38b4e66} .combat-log-head h3 {margin:0;font:16px var(--book);color:#312114} .combat-log ol {flex:1;min-height:0;overflow-y:auto;margin:0;padding:4px 9px;list-style:none} .combat-log li {display:flex;gap:8px;padding:3px 0;border-bottom:1px dotted #b38b4e55;font:13px var(--book);color:#4a3322} .combat-log li time {flex:0 0 38px;color:#9a7a55;font-size:11px;padding-top:2px} .combat-log li.is-latest {font-weight:bold;color:#2f2116} .combat-log .is-undone span {opacity:.5;text-decoration:line-through} .combat-add.combat-meta {width:min(360px,80vw)} .combat-meta label {flex:1 1 100%} .combat-meta select {width:100%} @media (min-width:781px) { .main-column:has(#view-combate.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-combate.active) {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:10px} #view-combate.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-combate .combat-chapter {flex:0 0 auto;min-height:0;margin-bottom:8px;padding:8px 18px} #view-combate .combat-chapter h1 {font-size:26px;margin:0} #view-combate .combat-chapter p {display:none} #view-combate .combat-board {flex:1;min-height:0;overflow:hidden} .combat-stage {overflow-y:auto} } @media (min-width:781px) and (max-height:820px) { #view-combate .combat-chapter {padding:5px 16px;margin-bottom:6px} #view-combate .combat-chapter h1 {font-size:22px} .combat-arena {padding:7px;gap:6px} .combat-title h2 {font-size:20px} .combat-order button {padding:2px 8px 2px 2px;font-size:12px} .combat-chip {width:22px;height:22px;flex-basis:22px} .combat-portrait {width:62px;height:62px;flex-basis:62px} .combat-actor {padding-bottom:5px} .combat-actor h3 {font-size:20px} .combat-stage {gap:6px;padding:8px} .combat-kinds span {padding:3px 10px} .combat-result {min-height:42px;padding:3px 10px} .combat-result b {font-size:26px} .combat-log {min-height:70px} .combat-face {width:40px;height:40px;flex-basis:40px} .combat-card {padding-top:5px;padding-bottom:5px;margin-bottom:6px} } @media (max-width:780px) { .combat-field {grid-template-columns:1fr} .combat-side {max-height:none} } #view-bestiario .toolbar {display:flex;align-items:center;gap:8px;flex-wrap:wrap} #view-bestiario .beast-actions {display:flex;align-items:center;gap:8px;margin-left:auto} body:not(.gm-active) #view-bestiario .beast-actions {display:none} @media (min-width:781px) { .main-column:has(#view-bestiario.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-bestiario.active) {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:10px} #view-bestiario.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-bestiario .chapter-header {flex:0 0 auto;min-height:0;margin-bottom:8px;padding:12px 18px} #view-bestiario .chapter-header h1 {font-size:32px;margin:2px 0} #view-bestiario .paper-section {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-bestiario .toolbar {flex:0 0 auto} #view-bestiario .bestiary-grid {flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;padding-right:4px} } #edit-session:disabled {opacity:.45} @media (min-width:781px) { .main-column:has(#view-cronicas.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-cronicas.active) {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:10px} #view-cronicas.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-cronicas .chronicle-chapter {flex:0 0 auto} #view-cronicas .open-book {flex:1;min-height:0;overflow:hidden} #view-cronicas .book-page {min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:14px 2px 14px 18px} #view-cronicas .book-title {flex:0 0 auto;margin-right:16px} #view-cronicas .chronicle-index,#view-cronicas .chronicle-detail {flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;padding-right:18px} } .mestre-entry {display:none;width:100%;margin-top:8px;padding:0;border:0;background:none;color:#e6d1aa;font:10px/1.3 var(--book);min-height:2.6em;text-align:left;text-decoration:underline;cursor:pointer;appearance:none} .sidebar-disclaimer {min-height:2.6em} body.gm-active .sidebar-disclaimer {display:none} body.gm-active .mestre-entry {display:block} .mestre-entry:hover,.mestre-entry.active {color:#fff6e8} .mestre-board {display:flex;flex-direction:column;gap:10px;min-height:0} .mestre-lock,.mestre-warn {margin:0;padding:12px 14px;border:1px solid #a3885e;background:#f6e5be;color:#3b281d;font:15px var(--book)} .mestre-lock p {margin:0 0 6px} .mestre-lock p:last-child {margin:0} .desk-tabs {display:flex;flex-wrap:wrap;gap:4px;flex:0 0 auto} .desk-tab {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:68px;min-height:58px;padding:4px 8px;border:1px solid #a07a4a;background:transparent;color:#f3e2c4;font:12px var(--book);cursor:pointer} .desk-tab img {width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 1px 1px #0006)} .desk-tab-mark {width:28px;height:28px;display:grid;place-items:center;font:18px var(--book);color:#f3e2c4} .desk-tab.active,.desk-tab:hover {background:#6d2e26;color:#fff6e8} .desk-pane {flex:1;min-height:0;display:flex;flex-direction:column;gap:8px} .desk-note-card {flex:1;min-height:0;width:100%;padding:14px 16px;border:1px solid #a3885e;background:#f8ecd0;color:#24160f;display:flex;flex-direction:column;gap:8px} .desk-note-card h2 {margin:0;font:26px var(--book);color:#24160f} .desk-note-card p {margin:0;font:15px/1.4 var(--book);color:#4a3424} .desk-note-card textarea {flex:1;min-height:160px;width:100%;padding:8px;border:1px solid #8d6840;background:#fffaf0;color:#24160f;font:16px var(--book);resize:none} .desk-note-actions {display:flex;align-items:center;justify-content:space-between;gap:12px} .desk-note-actions span {font:14px var(--book);color:#4a3424} .mestre-grid {display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1;min-height:0} .desk-pane .desk-panel {flex:1;min-height:0} .desk-pane .desk-panel ul {max-height:none;flex:1;min-height:0;padding-right:36px} .mestre-card {padding:12px;border:1px solid #a3885e;background:#f8ecd0;color:#2f2116} .mestre-card h2 {margin:0 0 4px;font:20px var(--book)} .mestre-card p {margin:0 0 8px;font:14px var(--book);color:#6d513d} .mestre-card .outline-button {margin-top:8px} .desk-panel {padding:12px;border:1px solid #a3885e;background:#f8ecd0;color:#2f2116;min-height:0;display:flex;flex-direction:column} .desk-panel header {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px} .desk-panel h2 {margin:0;font:20px var(--book)} .desk-panel ul {list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;max-height:220px;overflow:auto} .desk-row {display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid #b38b4e55} .desk-row span {min-width:0} .desk-row strong {display:block;font:15px var(--book);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .desk-row small {display:block;color:#6d513d;font:12px var(--book)} .desk-row .outline-button {flex:0 0 auto} .mestre-empty {margin:0;font:14px var(--book);color:#7a5b40} .desk-actions {display:flex;align-items:center;gap:8px;flex:0 0 auto} .desk-actions .red-button,.desk-row .outline-button {min-height:28px;padding:4px 10px} .preset-lines {display:flex;flex-direction:column;gap:6px;margin:8px 0} .preset-line {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center} .preset-line .minor-link {grid-column:2;grid-row:1 / span 3;align-self:center} .preset-line input {width:100%;min-width:0;border:1px solid #a18151;background:#fffaf0;color:#2f2116;font:14px var(--book);padding:4px 6px} .desk-pane:has(.mestre-backup) {overflow:auto;padding-right:28px} .mestre-backup .red-button,.mestre-backup .outline-button {margin:4px 8px 0 0} @media (min-width:781px) { .main-column:has(#view-mestre.active) {height:100vh;max-height:100vh;min-height:0;overflow:hidden} #main-content:has(#view-mestre.active) {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;padding-bottom:10px} #view-mestre.active {flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden} #view-mestre .mestre-chapter {flex:0 0 auto;min-height:0;margin-bottom:8px;padding:10px 18px} #view-mestre .mestre-chapter h1 {font-size:30px;margin:2px 0} #view-mestre .mestre-board {flex:1;min-height:0;overflow:hidden} } @media (max-width:780px) { .mestre-grid {grid-template-columns:1fr} } /* Modo escuro: páginas, menu e barra do topo escurecem. O bronze permanece. O modo claro conserva a madeira atual. */ html[data-theme="dark"] { --ink:#f3e6cc; --ink-soft:#cbb892; --paper:#2e261e; --paper-light:#3a3127; --paper-dark:#241c16; color-scheme:dark; } html[data-theme="dark"] :is(.parchment-corner,.panel-paper,.paper-section,.chapter-header) { color:#f3e6cc; background-color:#2e261e; background-image:radial-gradient(ellipse at 22% 4%,#5a46301f,transparent 48%),linear-gradient(125deg,#241c16,#3a3026 42%,#2a221b); border-color:#a77b41; outline-color:#6b5438; box-shadow:inset 0 0 0 4px #a77b4126,inset 0 0 20px #0008,0 3px 4px #0008; } html[data-theme="dark"] :is(.parchment-corner,.panel-paper,.paper-section):before, html[data-theme="dark"] :is(.parchment-corner,.panel-paper,.paper-section):after {color:#a77b41} html[data-theme="dark"] .chapter-header-image { background-image:linear-gradient(90deg,#2a2118 0%,#2a2118e6 42%,transparent 82%); } html[data-theme="dark"] .tavern-chapter {border-color:#b48f57} html[data-theme="dark"] .open-book { background:linear-gradient(90deg,#2a221b 0%,#3a3026 45%,#1a140f 49.75%,#120e0b 50%,#32281f 50.6%,#3a3026 100%); border-color:#241c16; outline-color:#a77b41; } html[data-theme="dark"] .right-page {border-left-color:#6b5438} html[data-theme="dark"] .detail-dialog { background:linear-gradient(135deg,#3a3026,#241c16); color:#f3e6cc; border-color:#a77b41; } html[data-theme="dark"] :is( .character-option,.npc-card,.beast-card,.filter-search,.atlas-controls button,.chronicle-row,.chronicle-relations button, .bestiary-index,.beast-index-item,.monster-page,.spotify-placeholder,.assets-editor,.map-legend,.quest-row, .combat-card,.combat-add,.combat-stage,.combat-log,.combat-kinds span,.desk-panel,.mestre-card, .sheet-main-card,.sheet-sidecard,.resource-card,.overview-grid div,.character-tab-panel,.tab-row,.character-extra, .rf-key-facts,.rf-health,.rf-facts>div,.rf-secondary-facts>div,.rf-tab-body,.rf-ability,.rf-save,.npc-stats span, .rf-form-body,.rf-form-block,.session-form-preview ) { background:#3a3127; color:#f3e6cc; border-color:#a77b41; } html[data-theme="dark"] :is(.character-option,.npc-card,.beast-card,.beast-index-item,.quest-row):hover, html[data-theme="dark"] :is(.chronicle-row:hover,.chronicle-row.active,.beast-card.active,.beast-index-item.active,.character-option.active,.quest-row.active) {background:#46392c} html[data-theme="dark"] :is(.npc-card,.beast-card) {box-shadow:inset 0 0 0 3px #a77b4133} html[data-theme="dark"] .monster-page {box-shadow:inset 0 0 0 4px #a77b4144} html[data-theme="dark"] .combat-card.enemy {background:#3a2824} html[data-theme="dark"] .combat-card.is-turn {background:#4a3b2c} html[data-theme="dark"] .combat-kinds input:checked+span {background:#6d2e26;color:#f6e2c2;border-color:#3c2119} html[data-theme="dark"] #view-personagens :is(.rf-tab-strip,.rf-ability strong,.sheet-quickfacts span) {background:#2a221b;color:#f3e6cc;border-color:#a77b41} html[data-theme="dark"] #view-personagens .rf-tab-strip {background:#241c16} html[data-theme="dark"] #view-personagens .rf-tab-strip button {background:#3a3127;color:#f3e6cc;border-color:#a77b41} html[data-theme="dark"] #view-personagens .rf-tab-strip button.active {background:#4a3b2c;color:#f6e7c8} html[data-theme="dark"] #view-personagens .rf-tab-strip .rf-edit-tab {background:#533024;color:#eed6ac} html[data-theme="dark"] #view-personagens :is(.character-tabs button,.rf-pdf) {background:#3a3127;color:#f3e6cc;border-color:#a77b41} html[data-theme="dark"] #view-personagens .rf-skill {color:#f3e6cc} html[data-theme="dark"] #view-personagens .rf-skill:hover, html[data-theme="dark"] #view-personagens :is(.rf-save:hover,.character-extra>summary:hover,.character-tabs button:hover) {background:#46392c} html[data-theme="dark"] #view-personagens .rf-ability button {background:#4b2820;color:#f6e3bd} html[data-theme="dark"] .rf-form-head {background:linear-gradient(180deg,#3a3026,#2a221b);border-bottom-color:#a77b41} html[data-theme="dark"] :is(.rf-form-portrait,.rf-form-error) {background:#2a221b} html[data-theme="dark"] .rf-form-error {color:#e07a6a} html[data-theme="dark"] :is(#main-content,.detail-dialog,dialog) :is(input[type="text"],input[type="number"],input[type="search"],input[type="url"],input[type="email"],input:not([type]),select,textarea) { background:#1c1612; color:#f3e6cc; border-color:#a77b41; color-scheme:dark; } html[data-theme="dark"] .filter-search input {background:transparent;border:0;color:inherit} html[data-theme="dark"] :is(#main-content,.detail-dialog,dialog) :is(h1,h2,h3,h4,p,li,small,strong,em,span,label,legend,i,a,dt,dd,summary,output,figcaption,b) {color:#f3e6cc} html[data-theme="dark"] :is(#main-content,.detail-dialog,dialog) :is(small,.label-caps,.folio-count) {color:#cbb892} html[data-theme="dark"] #main-content .minor-link {color:#e6c48a} html[data-theme="dark"] #main-content .minor-link:hover {color:#f0a098} html[data-theme="dark"] :is(#main-content,.detail-dialog,dialog) :is(.red-button,.outline-button,.file-chooser) :is(span,small,strong,i,b) {color:inherit} html[data-theme="dark"] :is(.beast-card-summary em,.beast-index-item em,.combat-card em) {color:#e07a6a} html[data-theme="dark"] .combat-side h3 {color:#bfe0c3} html[data-theme="dark"] .combat-enemy h3 {color:#f2b7a8} html[data-theme="dark"] :is(.combat-title h2,.combat-empty p,.combat-empty small) {color:#f6e4bd} html[data-theme="dark"] .combat-result b {color:#f0c56f} html[data-theme="dark"] .combat-result.damage b {color:#ff8f7a} html[data-theme="dark"] .combat-result.heal b {color:#8fe3a0} html[data-theme="dark"] .combat-flag {color:#3a210f} html[data-theme="dark"] .combat-flag.target {color:#fff1e4} html[data-theme="dark"] .combat-order button b {color:#d9b675} html[data-theme="dark"] #view-personagens .rf-save strong {color:#e6c48a} html[data-theme="dark"] .music-ornament {color:#c4a06a} html[data-theme="dark"] .combat-face.missing-image {background:#3a3127;color:#d8bd8a} html[data-theme="dark"] #view-personagens :is(.rf-key-facts,.rf-health,.rf-facts>div,.rf-secondary-facts>div,.rf-tab-body,.rf-ability,.rf-save,.sheet-main-card,.sheet-sidecard,.resource-card,.overview-grid>div,.character-tab-panel,.tab-row,.character-extra,.rf-roll-feedback,.sheet-quickfacts span) { background:#3a3127; color:#f3e6cc; border-color:#a77b41; box-shadow:inset 0 0 0 2px #a77b4126; } html[data-theme="dark"] #view-personagens .rf-ability strong {background:#241c16;color:#f3e6cc} html[data-theme="dark"] #main-content :is(.relation,.location-item.active,.location-item:hover,.tavern-preset,.spotify-pick,.mestre-lock,.mestre-warn,.chronicle-relations button) { background:#3a3127; color:#f3e6cc; border-color:#a77b41; } html[data-theme="dark"] #main-content .tavern-preset.active, html[data-theme="dark"] #main-content .spotify-item.active .spotify-pick {background:#6d2e26;color:#f6e2c2;border-color:#3c2119} html[data-theme="dark"] #main-content .relation.Aliado {background:#243628;color:#9dce96} html[data-theme="dark"] #main-content .relation.Hostil {background:#3a2220;color:#f0a098} html[data-theme="dark"] #main-content .relation.Neutro {background:#3a342c;color:#e6d3ae} html[data-theme="dark"] .tag-row span {background:#3a3127;color:#f3e6cc;border-color:#a77b41} html[data-theme="dark"] #view-personagens .rf-skill i {background:#6e6254;border-color:#a77b41} html[data-theme="dark"] #view-personagens .rf-skill i.is-trained {background:#34723f;border-color:#23592c} html[data-theme="dark"] .pdf-viewer iframe {background:#1c1612} html[data-theme="dark"] .rf-form-error {color:#e07a6a} html[data-theme="dark"] body {background:#0c0b0a} html[data-theme="dark"] .app-shell {background:radial-gradient(ellipse at 40% -10%,#2a2118 0,transparent 46%),repeating-linear-gradient(0deg,#141210 0 4px,#0e0d0c 5px 8px)} html[data-theme="dark"] .sidebar {background:linear-gradient(105deg,rgba(255,255,255,.03),transparent 28%),repeating-linear-gradient(92deg,#10100e 0 5px,#0c0b0a 6px 9px);border-right-color:#6d5430} html[data-theme="dark"] .brand {background:linear-gradient(180deg,#16130f,#0c0b0a);border-bottom-color:#6d5430} html[data-theme="dark"] .nav-link {background:linear-gradient(90deg,#141210,#0e0d0c);border-bottom-color:#3a3228} html[data-theme="dark"] .nav-link.active {background:linear-gradient(90deg,#6b2922,#421e1a);border-color:#bb904e;color:#fff0c9} html[data-theme="dark"] .topbar {background:linear-gradient(180deg,#141210,#080807);border-bottom-color:#8a6840} html[data-theme="dark"] .site-footer {background:#0c0b0a;border-top-color:#6d5430} html[data-theme="dark"] .mobile-current {background:#0c0b0a} html[data-theme="dark"] :is(.mini-preset,.mini-playlist,.global-search,.theme-switch,.lang-switch select) {background:#161311;color:#f3e6cc;border-color:#a77b41;color-scheme:dark} html[data-theme="dark"] :is(.mini-preset,.mini-playlist) option {background:#161311;color:#f3e6cc} html[data-theme="dark"] .global-search input {color:#f3e6cc} html[data-theme="dark"] :is(.spotify-embed,.mini-spotify-slot iframe) {color-scheme:normal;background:#12100e}