/* Product examples share the app's quiet, canvas-first hierarchy. */
:root{--preview-rule:#dce1df;--preview-muted:#69746f;--preview-panel:#f4f6f6;--preview-blue:#1669e8}
.studio-reveal{align-items:center}
.studio-title,.studio-caption{width:min(100%,calc((100svh - 240px)*4/3))}
.tablet{flex:none;aspect-ratio:4/3;width:min(100%,calc((100svh - 240px)*4/3));height:auto;min-height:0;max-height:none;border-width:10px;border-radius:29px}
.app-surface{height:100%}
.studio-title h2{font-size:clamp(26px,3vw,42px)}
.studio-title>span{font-size:12px}
.brush-catalog{gap:5px;padding-top:0}
.brush-catalog button{padding:11px 0;font-size:18px}
.brush-catalog img{width:30px;height:30px}
#brush-sample{height:350px}
.brush-description{grid-template-columns:1fr 1fr;gap:25px}
.ink-proof{margin-top:65px}

/* The same paper and typography in each layout mode. */
.infinite-world{inset:15px 4% 72px;background:var(--paper);border-radius:3px 3px 16px 3px}
.infinite-drawing{width:900px;height:420px;left:calc(50% - 450px);top:calc(50% - 210px);color:var(--ink)}
.infinite-title{font:48px NotSmooth;letter-spacing:-1.6px}
.infinite-subtitle{font:12px Manrope;fill:var(--preview-muted)}
.infinite-branch{font:26px NotSmooth;letter-spacing:-.5px}
.infinite-hint{font-size:10px;bottom:10px;left:12px;padding:5px}
#reset-map{font-size:10px;bottom:10px;right:16px}

/* Extras are full app views, with no tilted sheets or stacked cards. */
.module-console{grid-template-columns:135px minmax(0,1fr);gap:28px}
.product-module{height:480px;min-height:480px;background:var(--white);border:1px solid var(--preview-rule);border-radius:16px;display:block;padding:0;color:var(--ink);overflow:hidden}
.module-appbar{height:54px;padding:0 23px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--preview-rule);font-size:10px;color:var(--preview-muted)}
.module-appbar>div{display:flex;gap:19px}.module-appbar img{width:15px;height:15px;opacity:.75}.module-appbar>span{margin-right:auto;margin-left:27px}
.module-split{display:grid;grid-template-columns:1.1fr 1fr;height:calc(100% - 54px)}
.module-note{padding:32px 30px;min-width:0}
.note-subject{font:700 9px/1.5 Manrope;letter-spacing:.09em;color:var(--preview-muted)}
.product-module h4{font:800 24px/1.25 Manrope;letter-spacing:-.8px;color:var(--ink);margin:16px 0 27px}
.module-sidebar{background:var(--preview-panel);border-left:1px solid var(--preview-rule);padding:23px 24px;min-width:0}
.module-panel-title{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:800;margin-bottom:22px}.module-panel-title img{width:17px;height:17px}.module-panel-title small{font-size:9px;font-weight:600;margin-left:auto;color:var(--preview-muted)}
.equation-main{font:italic 26px/1.4 Georgia,serif;color:var(--preview-blue);white-space:nowrap}
.equation-working{font:italic 20px/1.5 Georgia,serif;margin:28px 0;color:var(--ink)}.equation-working p{margin:9px 0}.equation-working span{margin-left:15px}
.note-conclusion{border-left:2px solid var(--preview-blue);padding-left:15px}.note-conclusion>span{display:block;font-size:9px;color:var(--preview-muted)}.note-conclusion>strong{font:italic 25px Georgia,serif;color:var(--preview-blue);display:block;margin:7px 0}.note-conclusion p{font-size:11px;line-height:1.65;margin:7px 0 0}
.calculation-entry{font-size:13px;display:flex;flex-direction:column;gap:7px}.calculation-entry small{font-size:9px;color:var(--preview-muted)}
.function-graph{width:100%;height:220px;display:block;margin:8px 0 10px}
.calculation-result{display:flex;justify-content:space-between;gap:12px;font-size:11px;border-top:1px solid var(--preview-rule);padding-top:14px}.calculation-result strong{color:var(--preview-blue)}
.note-intro{font-size:12px;line-height:1.6;margin:-12px 0 27px;color:var(--preview-muted)}
.note-check{display:flex;align-items:center;gap:13px;font-size:13px;margin:22px 0;font-weight:650;line-height:1.4}.note-check i{width:15px;height:15px;border:1.4px solid currentColor;flex:none;border-radius:3px;font-style:normal;display:grid;place-items:center;font-size:11px}.note-check.done{color:var(--preview-muted)}.note-check.done span{text-decoration:line-through}.note-check.emphasized{color:var(--preview-blue)}
.note-context{font-size:10px;line-height:1.8;margin-top:30px;color:var(--preview-muted)}
.task-section-label{font-size:9px;font-weight:750;letter-spacing:.08em;color:var(--preview-muted);display:block;margin:20px 0 12px}
.task-item{padding:0 0 20px;border-bottom:1px solid var(--preview-rule)}.task-time{font-size:10px;color:var(--preview-blue)}.task-item strong{display:block;font-size:13px;margin:7px 0 8px}.task-item>span:last-of-type{font-size:9px;color:var(--preview-muted)}.task-source{font-size:9px;color:var(--preview-blue);margin-top:13px}.task-completed{font-size:10px;color:var(--preview-muted);margin-top:23px}
.calendar-topline{display:flex;justify-content:space-between;align-items:center;padding:26px 28px 24px}.calendar-topline h4{font-size:26px;margin:7px 0 0}.calendar-modes{display:flex;gap:17px;font-size:10px;color:var(--preview-muted)}.calendar-modes b{color:var(--preview-blue)}
.calendar-week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:calc(100% - 110px);padding:0 20px}.calendar-column{border-left:1px solid var(--preview-rule);padding:0 11px}.calendar-column:first-child{border-left:0}.calendar-date{display:flex;align-items:center;gap:9px;margin-bottom:25px}.calendar-date>span{font-size:8px;color:var(--preview-muted)}.calendar-date>strong{font-size:19px;letter-spacing:-1px}.calendar-column:nth-child(3) .calendar-date{color:var(--preview-blue)}
.calendar-entry{border-left:2px solid var(--preview-blue);padding:3px 0 7px 10px}.calendar-entry time{font-size:8px;color:var(--preview-muted)}.calendar-entry strong{display:block;font-size:11px;line-height:1.5;margin-top:8px}.calendar-entry p{font-size:9px;line-height:1.6;color:var(--preview-muted);margin:6px 0}.calendar-entry.secondary{margin-top:28px;border-color:#b6c0c1}.note-preview-lines{margin-top:14px;max-width:80px}.note-preview-lines i{height:1px;background:#bdc9d8;display:block;margin:6px 0}.note-preview-lines i:nth-child(2){width:77%}.note-preview-lines i:last-child{width:89%}
.module-plan{position:relative;height:calc(100% - 54px);padding:24px 30px}.module-plan h4{margin:10px 0}.desk-plan{position:absolute;width:90%;height:300px;top:91px;left:5%}
.precision-ruler{position:absolute;left:25%;width:51%;height:51px;top:327px;display:flex;justify-content:space-between;padding:25px 10px 0;background:#dce8efda;border:1px solid #a5b9c7;color:#4f6776;font-size:8px;box-shadow:0 3px 8px #233f5110}.precision-ruler>div{position:absolute;top:0;left:10px;right:10px;height:18px;background:repeating-linear-gradient(90deg,#718995 0 1px,transparent 1px 8px)}.precision-ruler b{position:absolute;right:10px;bottom:3px;font-size:7px}
.zen-document{position:relative;height:100%}.focus-note{padding:35px 7%;max-width:800px}.focus-note h4{font-size:27px;line-height:1.35;margin:17px 0 29px}.focus-columns{display:grid;grid-template-columns:1fr 2fr;gap:26px;max-width:590px}.focus-columns>div:first-child{border-right:1px solid var(--preview-rule);padding-right:20px}.focus-columns p{font-size:12px;line-height:1.8;margin:0 0 16px}.focus-columns .study-label{margin-bottom:11px;display:block}.focus-summary{font-size:16px;font-weight:800;color:var(--preview-blue);margin-top:24px}
.module-rail{position:absolute;bottom:24px;right:19px;display:flex;flex-direction:column;gap:18px;padding:12px;background:var(--preview-panel);border-radius:13px;transition:opacity .35s,transform .35s}.module-rail img{width:19px;height:19px}.module-rail i{width:19px;height:19px;background:var(--preview-blue);border-radius:50%}.zen-document .module-appbar{transition:opacity .35s}.zen-document .zen-switch{left:auto;right:83px;bottom:21px;background:var(--ink);font-size:10px;padding:10px 14px}.zen-document.is-zen .module-appbar{opacity:0}.zen-document.is-zen .module-rail{opacity:0;transform:translateX(70px)}

/* Explicit ordering controls and a literal preview of the resulting rail. */
.tool-order{display:flex;flex-direction:column;gap:0;max-width:345px;margin-top:28px;border-top:1px solid var(--preview-rule)}
.order-row{width:100%;display:flex;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--preview-rule)}
.order-position{font-size:10px;color:var(--preview-muted);width:14px}.order-row>img{width:23px;height:23px}.order-name{flex:1;font-size:13px;font-weight:750}
.tool-order .order-row button{padding:7px;display:grid;place-items:center;min-width:32px;cursor:pointer;border-radius:5px}
.tool-order .order-row button img{width:15px;height:15px}.tool-order .order-row button:hover{background:#dce4e7}.tool-order .order-row button:disabled{opacity:.2;cursor:default;background:transparent}.up-arrow{transform:rotate(180deg)}
.custom-paper{transform:none;border-radius:12px;min-height:380px;border:1px solid var(--preview-rule)}.custom-rail{background:var(--preview-panel)}
.order-status{font-size:10px!important;line-height:1.6;min-height:32px;max-width:345px}

/* A shared study plan: useful structure, clear data, specific annotations. */
.shared-workspace{padding:25px 35px 35px;border:1px solid var(--preview-rule);border-radius:15px}
.shared-meta{padding-bottom:21px;border-bottom:1px solid var(--preview-rule);font-size:10px}
.study-heading{margin-top:30px}.study-heading>span,.study-label{font-size:9px;font-weight:750;letter-spacing:.08em;color:var(--preview-muted)}
.study-heading h3{font:800 clamp(24px,3.1vw,40px)/1.2 Manrope;letter-spacing:-1.3px;margin:12px 0}.study-heading>p{font-size:13px;line-height:1.6;color:var(--preview-muted);margin:0}
.study-content{display:grid;grid-template-columns:1fr 1.2fr;gap:7%;margin-top:38px}
.study-protocol h4{font-size:22px;line-height:1.35;letter-spacing:-.5px;margin:13px 0 25px}.study-protocol ol{list-style:none;padding:0;counter-reset:steps}.study-protocol li{counter-increment:steps;position:relative;padding-left:31px;margin:21px 0}.study-protocol li:before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;top:2px;color:var(--preview-blue);font-size:10px}.study-protocol li b{display:block;font-size:12px}.study-protocol li span{font-size:11px;line-height:1.65;display:block;margin-top:6px;color:var(--preview-muted)}
.study-decision{border-left:2px solid #54755e;padding-left:13px;margin-top:28px;max-width:340px}.study-decision>span{font-size:9px;color:#54755e;font-weight:800}.study-decision p{font-size:11px;line-height:1.7;margin:7px 0}
.retention-chart{width:100%;display:block;margin-top:22px}.chart-key{display:flex;gap:25px;justify-content:center;font-size:10px}.chart-key span{display:flex;align-items:center;gap:7px}.chart-key i{width:15px;height:2px;background:var(--preview-blue)}.chart-key span:last-child i{background:var(--preview-muted)}.study-takeaway{font-size:12px;font-weight:750;line-height:1.7;margin:25px 0 9px;padding-top:19px;border-top:1px solid var(--preview-rule)}.study-data-note{font-size:9px;line-height:1.7;color:var(--preview-muted)}
.cursor-blue{left:87%;top:56%;animation:study-blue 8s ease-in-out infinite}.cursor-rust{left:34%;top:82%;color:#54755e;animation:study-green 9s ease-in-out infinite}.cursor-rust span{background:#54755e}
.study-annotation{stroke-dasharray:250;animation:study-ink 8s ease-in-out infinite}
@keyframes study-blue{0%,100%{translate:0 0}40%,70%{translate:-17px 11px}}
@keyframes study-green{0%,100%{translate:0 0}40%,70%{translate:-12px -15px}}
@keyframes study-ink{0%,10%{stroke-dashoffset:250}50%,95%{stroke-dashoffset:0}100%{stroke-dashoffset:250}}
.motion-paused .study-annotation{animation-play-state:paused}
@media(max-width:1000px){.module-console{grid-template-columns:100px minmax(0,1fr);gap:20px}.module-note{padding:25px 20px}.module-sidebar{padding:22px 18px}.product-module h4{font-size:20px}.equation-main{font-size:22px}.equation-working{font-size:17px}.module-split{grid-template-columns:1fr 1fr}.calendar-week{padding:0 8px}.calendar-column{padding:0 8px}.calendar-entry{padding-left:7px}.calendar-entry strong{font-size:10px}.shared-workspace{padding:23px}.study-content{gap:5%}.study-protocol h4{font-size:20px}}
@media(max-width:700px){
 .studio-title,.studio-caption,.tablet{width:100%;max-width:550px}.tablet{height:auto;min-height:0;max-height:none;aspect-ratio:4/3;border-width:7px;border-radius:24px}.studio-reveal{gap:16px;top:15%;bottom:12%}.studio-title h2{font-size:27px}.app-chrome{gap:0}.canvas-hint{font-size:8px;bottom:15px;max-width:130px}.tool-rail{right:8px;bottom:8px;width:41px;padding:3px;border-radius:13px}#rail-tools button{height:30px;width:35px;border-radius:9px}#rail-tools img{height:18px;width:18px}.rail-color{height:32px;width:35px}.rail-pager{width:35px;height:22px;font-size:8px}.rail-color span{width:19px;height:19px}
 .brush-catalog{display:grid;grid-template-columns:repeat(4,1fr);gap:15px 8px;overflow:visible}.brush-catalog button{font-size:10px;gap:7px;padding:8px 0;text-align:center}.brush-catalog img{width:26px;height:26px}#brush-sample{height:230px}.brush-description{display:block}.ink-proof{margin-top:35px}
 .infinite-world{inset:15px 0 72px}.infinite-drawing{width:790px;height:369px;left:calc(50% - 395px);top:calc(50% - 184.5px)}.infinite-title{font-size:47px}.infinite-hint{bottom:10px;font-size:9px}#reset-map{bottom:10px;font-size:9px}
 .module-console{display:block}.product-module{height:auto;min-height:490px;border-radius:12px}.module-appbar{height:43px;padding:0 14px;font-size:8px}.module-appbar>div{gap:14px}.module-appbar img{width:12px;height:12px}.module-appbar>span{margin-left:20px}
 .module-split{display:block}.module-note{padding:22px 23px}.product-module h4{font-size:21px;margin:12px 0 22px}.note-subject{font-size:8px}.equation-main{font-size:23px}.equation-working{font-size:18px;margin:18px 0}.note-conclusion{display:grid;grid-template-columns:1fr 1.3fr;gap:0 10px}.note-conclusion>strong{grid-column:1}.note-conclusion p{grid-column:2;grid-row:1/3;font-size:10px}.module-sidebar{border-left:0;border-top:1px solid var(--preview-rule);padding:20px 23px}.module-panel-title{font-size:12px;margin-bottom:17px}.function-graph{height:210px;margin:8px 0}.calculation-result{font-size:11px}.note-check{font-size:12px;margin:20px 0}.note-intro{font-size:11px}.note-context{font-size:10px;margin:23px 0 3px}.task-section-label{font-size:8px}.task-item strong{font-size:12px}.task-item{padding-bottom:15px}.task-completed{font-size:9px;margin-top:18px}
 .calendar-topline{padding:24px 19px;gap:8px;align-items:start}.calendar-topline h4{font-size:20px;margin:8px 0 0}.calendar-modes{font-size:8px;gap:10px;margin-top:31px}.calendar-week{display:block;padding:0 19px 20px;height:auto}.calendar-column{display:grid;grid-template-columns:45px 1fr;gap:10px;border:0;border-top:1px solid var(--preview-rule);padding:17px 0}.calendar-date{display:block;margin:0}.calendar-date span{font-size:8px;display:block}.calendar-date strong{font-size:20px;display:block;margin-top:4px}.calendar-entry{grid-column:2}.calendar-entry strong{font-size:12px;margin-top:4px}.calendar-entry p{font-size:10px;margin:4px 0}.calendar-entry.secondary{margin-top:4px}.note-preview-lines{display:none}
 .module-ruler{min-height:440px;height:440px}.module-plan{padding:25px 22px;height:397px}.desk-plan{width:135%;left:-18%;height:260px;top:102px}.precision-ruler{left:14%;width:69%;top:316px;height:43px;padding-top:23px;font-size:6px}.precision-ruler>div{height:17px}
 .module-zen{height:550px;min-height:550px}.focus-note{padding:28px 24px}.focus-note h4{font-size:24px;line-height:1.4;margin:18px 0 27px}.focus-columns{grid-template-columns:1fr;gap:12px;padding-right:35px}.focus-columns>div:first-child{border:0;padding:0}.focus-columns>div:first-child p{font-size:12px}.focus-columns>div:first-child p br{display:none}.focus-columns p{font-size:11px;line-height:1.7}.focus-summary{font-size:14px;margin-top:16px}.module-rail{bottom:24px;right:13px;gap:17px;padding:10px}.module-rail img,.module-rail i{width:17px;height:17px}.zen-document .zen-switch{right:68px;bottom:24px;font-size:9px;padding:9px 12px}
 .tool-order{max-width:none;gap:0}.order-row{gap:14px;padding:12px 0}.tool-order .order-row button{min-width:35px;width:35px;padding:9px}.custom-paper{min-height:350px;transform:none}.order-status{max-width:none;font-size:9px!important}.customizer{margin-top:22px}
 .shared-workspace{padding:19px 21px 26px;border-radius:12px}.shared-meta{font-size:8px;gap:15px;align-items:start;padding-bottom:17px}.shared-presence{max-width:106px}.study-heading{margin-top:23px}.study-heading>span,.study-label{font-size:8px}.study-heading h3{font-size:27px;letter-spacing:-.8px;line-height:1.25;margin:12px 0}.study-heading>p{font-size:11px}.study-content{display:block;margin-top:30px}.study-protocol h4{font-size:21px;margin:12px 0 24px}.study-protocol li{margin:18px 0}.study-protocol li b{font-size:12px}.study-protocol li span{font-size:11px}.study-decision{margin:24px 0 30px}.study-results{border-top:1px solid var(--preview-rule);padding-top:25px}.retention-chart{margin-top:20px}.chart-key{font-size:8px;gap:18px}.study-takeaway{font-size:11px;margin-top:20px}.study-data-note{font-size:8px}.cursor-blue{left:85%;top:75%}.cursor-rust{left:77%;top:50%}
}
.precision-ruler{top:357px}
@media(max-width:700px){.precision-ruler{top:334px}}
@media(prefers-reduced-motion:reduce){.study-annotation{animation:none;stroke-dashoffset:0}.module-rail,.zen-document .module-appbar{transition:none}}