/* Standalone web mode. No overlay or styling is applied inside YouTube's frame. */
.web-mode-page [hidden]{display:none!important}
.web-header{border-bottom:1px solid var(--line)}
.web-header .beta{font-size:9px;letter-spacing:.07em}
.web-main{padding-top:52px;padding-bottom:70px}
.web-intro{display:grid;grid-template-columns:1.3fr 1fr;align-items:end;gap:50px;margin-bottom:38px}
.web-intro .eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;margin-bottom:17px}
.web-intro h1{font-size:clamp(35px,4.8vw,62px);font-weight:630;line-height:1.06;margin:0;letter-spacing:-.05em}
.web-intro h1 span{color:#7f914e}
.web-intro>p{max-width:370px;font-size:14px;line-height:1.8;margin:0 0 4px}
.web-layout{display:grid;grid-template-columns:minmax(290px,365px) minmax(0,1fr);gap:26px;align-items:start;min-width:0;max-width:100%}
.web-layout>*,.web-intro>*{min-width:0;max-width:100%}
.web-card{background:var(--white);border:1px solid var(--line);border-radius:19px;padding:25px}
.web-card-heading{display:flex;gap:13px;align-items:center;margin-bottom:23px}
.web-step{display:grid;place-content:center;width:29px;height:29px;flex:none;border-radius:50%;border:1px solid #c3ceb3;color:#758b58;font-size:10px;font-weight:700}
.web-card h2{font-size:22px;line-height:1.2;letter-spacing:-.035em;margin:0}
.web-add-form>label,.web-time-row label{display:block;font-size:12px;font-weight:650;line-height:1.4;margin-bottom:8px}
.web-add-row{display:flex;flex-direction:column;gap:8px}
.web-mode-page input[type="url"],.web-mode-page input[type="number"]{display:block;width:100%;min-width:0;min-height:45px;padding:12px;font:inherit;font-size:13px;line-height:1.5;color:var(--ink);background:var(--paper);border:1px solid #bdc9ba;border-radius:9px}
.web-mode-page input:focus-visible,.web-mode-page summary:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.web-add-row>.button{width:100%;min-height:41px;font-size:12px;padding:10px 14px;justify-content:space-between}
.web-field-help{font-size:10px;line-height:1.7;color:var(--muted);margin:9px 0 0}
.web-queue{list-style:none;counter-reset:web-queue;padding:0;margin:19px 0 0;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0;max-width:100%;max-height:260px;overflow:auto}
.web-queue:empty{display:none}
.web-queue>li{counter-increment:web-queue;display:flex;align-items:flex-start;gap:9px;min-width:0;max-width:100%;padding:11px 9px;border:1px solid var(--line);border-radius:9px;background:var(--paper);font-size:11px;line-height:1.6;overflow-wrap:anywhere}
.web-queue>li::before{content:counter(web-queue,decimal-leading-zero);color:#7f8e74;flex:none;font-size:9px;font-weight:700;padding-top:2px}
.web-queue>li>span,.web-queue>li>a{min-width:0;flex:1;overflow-wrap:anywhere}
.web-queue button{flex:none;min-width:28px;min-height:28px;border:1px solid #c6d1bf;border-radius:6px;color:var(--body);background:transparent;font:inherit;font-size:10px;padding:4px 6px;line-height:1.3}
.web-queue button:hover{background:#e6ecdb}
.web-empty{margin:19px 0 0;padding:19px 14px;border:1px dashed #c6d0bd;border-radius:9px;color:var(--muted);font-size:11px;text-align:center;line-height:1.7}
.web-start-form{border-top:1px solid var(--line);margin-top:23px;padding-top:22px}
.web-time-row{display:flex;gap:14px;justify-content:space-between;align-items:center}
.web-time-row label{margin-bottom:2px}
.web-time-row .web-field-help{margin:0}
.web-minute-input{display:flex;align-items:center;gap:7px;flex:none;font-size:11px;color:var(--muted)}
.web-minute-input input[type="number"]{width:72px;text-align:center;padding:10px 5px;font-variant-numeric:tabular-nums;font-size:15px}
.web-consent-box{margin-top:23px;padding:15px 13px;background:#f1f3e9;border:1px solid #d7dfcb;border-radius:11px}
.web-consent-label{display:flex;align-items:flex-start;gap:9px;font-size:11px;font-weight:600;line-height:1.65;color:var(--ink);cursor:pointer}
.web-consent-label input{width:16px;height:16px;flex:none;accent-color:var(--ink);margin:3px 0 0}
.web-consent-box p{font-size:10px;line-height:1.75;margin:10px 0 0;color:var(--muted)}
.web-consent-box a,.web-help a,.web-noscript a{text-underline-offset:3px}
.web-start{display:flex;width:100%;justify-content:space-between;margin-top:16px;font-size:13px}
.web-memory-note{font-size:10px;line-height:1.75;color:var(--muted);margin:11px 0 0}
.web-session{min-width:0;padding-top:4px}
.web-viewing-heading{display:flex;gap:18px;justify-content:space-between;align-items:center;margin-bottom:18px}
.web-viewing-heading .eyebrow{font-size:9px;margin-bottom:7px}
.web-viewing-heading h2{font-size:24px;line-height:1.2;letter-spacing:-.035em;margin:0}
.web-clock{flex:none;text-align:right}
.web-clock-label{display:block;font-size:9px;color:var(--muted);margin-bottom:2px}
.web-timer{display:block;font-size:30px;font-weight:650;letter-spacing:-.05em;line-height:1.15;font-variant-numeric:tabular-nums}
.web-current{font-size:11px;line-height:1.7;margin:0 0 11px;color:var(--muted);min-height:19px;overflow-wrap:anywhere}
.web-player-frame{width:100%;min-width:200px;min-height:200px;aspect-ratio:16/9;background:#e9ecdd;border:1px solid var(--line);border-radius:3px;overflow:visible}
.web-player-frame>div,.web-player-frame>iframe{display:block;width:100%;height:100%;min-width:200px;min-height:200px;border:0}
#web-player-mount iframe{display:block;width:100%;max-width:100%;height:100%;min-height:200px;border:0}
.web-player-note{font-size:10px;line-height:1.75;color:var(--muted);margin:12px 0 16px;max-width:600px}
.web-session-controls{display:flex;flex-wrap:wrap;gap:10px;margin:17px 0}
.web-session-controls .button{font-size:12px;min-height:45px;padding:12px 16px}
.web-mode-note{font-size:11px;line-height:1.75;color:var(--muted);margin:0 0 16px}
.web-status-box{padding:16px 18px;background:#edf1e5;border:1px solid #d6dfca;border-radius:11px}
.web-status-box>p{font-size:12px;line-height:1.75;margin:0;overflow-wrap:anywhere;color:var(--ink)}
.web-release-note{margin-bottom:24px}
.web-status-box>.button{margin-top:12px;font-size:11px}
.web-help{border-top:1px solid var(--line);padding-top:18px;margin-top:22px;color:var(--muted)}
.web-help summary{cursor:pointer;font-size:12px;font-weight:600;color:var(--body)}
.web-help ul{padding-left:18px;margin:16px 0 10px}
.web-help li{font-size:11px;line-height:1.8;padding-left:3px;margin-bottom:9px}
.web-help>p{font-size:11px;line-height:1.7;margin:13px 0 0}
.web-noscript{padding:17px;border:1px solid #d2b49c;border-radius:10px;font-size:13px;margin:25px 0 0}
.web-footer{border-top:1px solid var(--line)}
.web-footer>a:last-child{font-size:11px;text-underline-offset:3px}
@media(max-width:1000px){.web-main{padding-top:35px}.web-intro{gap:25px}.web-intro>p{font-size:12px}.web-layout{grid-template-columns:minmax(270px,320px) minmax(0,1fr);gap:20px}.web-card{padding:21px}.web-viewing-heading h2{font-size:21px}.web-timer{font-size:27px}}
@media(max-width:830px){.web-intro{grid-template-columns:1fr;gap:20px;margin-bottom:28px}.web-intro>p{max-width:610px;font-size:13px}.web-layout{grid-template-columns:1fr;gap:32px}.web-card{padding:25px}.web-add-row{flex-direction:row}.web-add-row>input{flex:1}.web-add-row>.button{width:auto;flex:none;gap:12px}.web-queue{max-height:220px}.web-player-frame{max-width:100%}.web-viewing-heading h2{font-size:25px}.web-start{max-width:350px}.web-consent-box{max-width:650px}.web-viewing-heading{margin-bottom:15px}.web-header .web-home{font-size:10px;gap:7px;padding:10px 12px}}
@media(max-width:480px){.web-main{padding-top:30px;padding-bottom:45px}.web-intro h1{font-size:37px;line-height:1.1}.web-intro .eyebrow{font-size:8px}.web-intro>p{font-size:12px}.web-card{padding:18px}.web-card h2{font-size:21px}.web-add-row{flex-direction:column}.web-add-row>.button{width:100%}.web-mode-page input[type="url"]{font-size:14px}.web-start{max-width:none}.web-viewing-heading h2{font-size:21px;max-width:230px}.web-timer{font-size:25px}.web-clock-label{font-size:8px}.web-session-controls{display:grid;grid-template-columns:1fr;gap:8px}.web-session-controls .button{width:100%}.web-memory-note,.web-consent-box p{font-size:10px}.web-header .brand{font-size:18px}.web-header .beta{font-size:8px;letter-spacing:0}.web-header .web-home{font-size:9px;padding:9px}.web-status-box{padding:14px}}
@media(max-width:340px){.web-mode-page .wrap{padding-inline:15px}.web-header .brand{font-size:16px;gap:6px}.web-header .beta{display:none}.web-intro h1{font-size:33px}.web-card{padding:14px}}